Элементы выбора Javascript для реагирования выбора на модальном с использованием консоли Chrome - PullRequest
Новая
       43

Элементы выбора Javascript для реагирования выбора на модальном с использованием консоли Chrome

0 голосов
/ 10 октября 2019

У меня есть проект, построенный с использованием ReactJS

Я пытаюсь протестировать свой код, используя javascript в консоли Chrome.

У меня есть код, аналогичный этому сайту https://jedwatson.github.io/react-select/

Я пошел, чтобы нажать на кнопку. Это открывает модальное пространство, в котором есть реагирующий выбранный компонент. Я хочу выбрать элемент в этом выделении victoria.

HTML-код: 

    <div class="Select has-value is-clearable is-focused is-open is-searchable Select--single">
    <input type="hidden" name="selected-state" value="new-south-wales">
    <div class="Select-control"><span class="Select-multi-value-wrapper" id="react-select-2--value">
<div class="Select-value State-NSW"><span class="Select-value-label" role="option" aria-selected="true" id="react-select-2--value-item">New South Wales</span></div>
    <div class="Select-input" style="display: inline-block;">
        <input id="state-select" aria-activedescendant="react-select-2--option-1" aria-expanded="true" aria-haspopup="true" aria-owns="react-select-2--list" role="combobox" value="" style="box-sizing: content-box; width: 5px;">
        <div style="position: absolute; top: 0px; left: 0px; visibility: hidden; height: 0px; overflow: scroll; white-space: pre; font-size: 14px; font-family: &quot;Helvetica Neue&quot;, Helvetica, Arial, sans-serif; font-weight: 400; font-style: normal; letter-spacing: normal; text-transform: none;"></div>
    </div>
    </span><span aria-label="Clear value" class="Select-clear-zone" title="Clear value"><span class="Select-clear">×</span></span><span class="Select-arrow-zone"><span class="Select-arrow"></span></span>
</div>
<div class="Select-menu-outer">
    <div class="Select-menu" id="react-select-2--list" role="listbox" tabindex="-1">
        <div class="Select-option State-ACT" role="option" aria-label="Australian Capital Territory" id="react-select-2--option-0">Australian Capital Territory</div>
        <div class="Select-option is-selected is-focused State-NSW" role="option" aria-label="New South Wales" id="react-select-2--option-1">New South Wales</div>
        <div class="Select-option State-Vic" role="option" aria-label="Victoria" id="react-select-2--option-2">Victoria</div>
        <div class="Select-option State-Qld" role="option" aria-label="Queensland" id="react-select-2--option-3">Queensland</div>
        <div class="Select-option State-WA" role="option" aria-label="Western Australia" id="react-select-2--option-4">Western Australia</div>
        <div class="Select-option State-SA" role="option" aria-label="South Australia" id="react-select-2--option-5">South Australia</div>
        <div class="Select-option State-Tas" role="option" aria-label="Tasmania" id="react-select-2--option-6">Tasmania</div>
        <div class="Select-option State-NT" role="option" aria-label="Northern Territory" id="react-select-2--option-7">Northern Territory</div>
    </div>
</div>
</div>

Как выбрать «victoria» с помощью JavaScript в консоли Chrome?

Я попробовал 

var country = document.getElementById("react-select-2--list");
country.document.querySelector("div #react-select-2--option-1").value='victoria';

Извините, я новичок в тесте

...