尝试 select 下拉列表中的值
Trying to select a value from a drop-down
我正在访问的页面上有一个表格。此表单有一个包含 3 个选项的下拉列表。我需要select第三个选项。使用 cefsharp 库(嵌入式网络浏览器)从 C# 程序访问网页。
我可以使用
更改显示的文本
document.forms[0].getElementsByClassName('css-0 Select__single-value')[0].innerText="Keep in-play";
但这还没有被注册。还尝试触发输入和更改事件,但它仍然无法识别我的 selection。
有什么建议吗?
这是表格的原始 DOM:
<div class="bet-widget-optional-params">
<div class="bet-params">
<div class="param-wrapper"><span class="param-label"><a class="link" href="https://help.smarkets.com/hc/en-gb/articles/115003946591" target="_blank">Time In Force</a></span>
<div class="param-select">
<div class="css-0 Select custom-select-box Select menu-on-click">
<div class="css-0 Select__control">
<div class="css-0 Select__value-container Select__value-container--has-value">
<div class="css-0 Select__single-value">Default</div><input id="react-select-bet-param-selector-input" readonly="" tabindex="0" class="css-14uuagi" value=""></div>
<div class="css-0 Select__indicators"><span class="css-0 Select__indicator-separator"></span><span aria-hidden="true" class="Select__arrow-zone"><span class="Select__arrow"></span></span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
在JavaScript中可以设置selectedIndex
属性.
elem.selectedIndex = 2;
设置 -1
将删除任何 select 离子,任何正整数将 select 列表中的该项目(0-索引)...所以如果你想要第三个项目,只需将其设置为 2
.
HTMLSelectElement.selectedIndex docs
属性 也作为 getter 工作,所以如果您想知道哪个元素是 selected,您可以这样请求:
var currentSelectedIndex = elem.selectedIndex;
下面是完整的交互示例:
var selectElem = document.getElementById('select');
var pElem = document.getElementById('p');
var buttonElem = document.getElementById('button');
selectElem.addEventListener('change', function() {
var index = selectElem.selectedIndex;
pElem.innerHTML = 'selectedIndex: ' + index;
});
buttonElem.addEventListener('click', function(){
selectElem.selectedIndex = 2;
});
<p id="p">selectedIndex: 0</p>
<select id="select">
<option selected>Option A</option>
<option>Option B</option>
<option>Option C</option>
<option>Option D</option>
<option>Option E</option>
</select>
<input type="button" id="button" value="Set it to C (2)"/>
我正在访问的页面上有一个表格。此表单有一个包含 3 个选项的下拉列表。我需要select第三个选项。使用 cefsharp 库(嵌入式网络浏览器)从 C# 程序访问网页。
我可以使用
更改显示的文本document.forms[0].getElementsByClassName('css-0 Select__single-value')[0].innerText="Keep in-play";
但这还没有被注册。还尝试触发输入和更改事件,但它仍然无法识别我的 selection。 有什么建议吗?
这是表格的原始 DOM:
<div class="bet-widget-optional-params">
<div class="bet-params">
<div class="param-wrapper"><span class="param-label"><a class="link" href="https://help.smarkets.com/hc/en-gb/articles/115003946591" target="_blank">Time In Force</a></span>
<div class="param-select">
<div class="css-0 Select custom-select-box Select menu-on-click">
<div class="css-0 Select__control">
<div class="css-0 Select__value-container Select__value-container--has-value">
<div class="css-0 Select__single-value">Default</div><input id="react-select-bet-param-selector-input" readonly="" tabindex="0" class="css-14uuagi" value=""></div>
<div class="css-0 Select__indicators"><span class="css-0 Select__indicator-separator"></span><span aria-hidden="true" class="Select__arrow-zone"><span class="Select__arrow"></span></span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
在JavaScript中可以设置selectedIndex
属性.
elem.selectedIndex = 2;
设置 -1
将删除任何 select 离子,任何正整数将 select 列表中的该项目(0-索引)...所以如果你想要第三个项目,只需将其设置为 2
.
HTMLSelectElement.selectedIndex docs
属性 也作为 getter 工作,所以如果您想知道哪个元素是 selected,您可以这样请求:
var currentSelectedIndex = elem.selectedIndex;
下面是完整的交互示例:
var selectElem = document.getElementById('select');
var pElem = document.getElementById('p');
var buttonElem = document.getElementById('button');
selectElem.addEventListener('change', function() {
var index = selectElem.selectedIndex;
pElem.innerHTML = 'selectedIndex: ' + index;
});
buttonElem.addEventListener('click', function(){
selectElem.selectedIndex = 2;
});
<p id="p">selectedIndex: 0</p>
<select id="select">
<option selected>Option A</option>
<option>Option B</option>
<option>Option C</option>
<option>Option D</option>
<option>Option E</option>
</select>
<input type="button" id="button" value="Set it to C (2)"/>