提问者:小点点

从选择框中选择选项


我如何选择一个选项与javascript(/控制台在谷歌铬)?这是html代码的一部分:

<nobr>
    Element<br>
    <span class="absatz">
     &nbsp;<br>
    </span>
    <select name="element" class="selectbox" style="width:114" size="12" onchange="doDisplayTimetable(NavBar, topDir);">
        <option value="0">- All -</option>
        <option value="1">A</option>
        <option value="2">B</option>
        <option value="3">X</option>
        <option value="4">C</option>
        <option value="5">D</option>
        <option value="6">E</option>
        <option value="7">F</option>
        <option value="8">G</option>
        <option value="9">H</option>
        <option value="10">I</option>
        <option value="11">J</option>
        <option value="12">K</option>
        <option value="13">L</option>
        <option value="14">M</option>
        <option value="15">N</option>
        <option value="16">O</option>
        <option value="17">P</option>
        <option value="18">Q</option>
        <option value="19">R</option>
    </select>
</nobr>

或者http://pastebin.com/JSaKg4HB

我已经试过了:

document.getElementsByName("element")[0].value = 1;

但它给了我一个错误:

未捕获的TypeError:无法在对象的2:48设置未定义的属性“值”。注入脚本_在对象上计算(:875:140)。注入脚本_在对象处求值并换行(:808:34)。注入脚本。评估(:664:21)

编辑:我我试过了,但它不适用于整个网站。也许是因为在第一个html标签里面有另一个html标签(如果我下载网站,在selectbox所在的地方有另一个名为welcome.html的html文件)。我认为它在iFrame中,因为chrome给了我“显示框架”的选项。

编辑2:我可以访问selectbox所在的框架,但仍然找不到selectbox。这是框架的代码(不是完整代码):pastebin。com/iVUeDbYV


共3个答案

匿名用户

试试这个:

document.querySelectorAll('[name="element"]')[0].value;

虽然很奇怪,getElementsByName不适合您。您确定元素在同一文档中,而不是在iFrame中吗?

匿名用户

简单的答案是:

document.getElementById("select_element").selectedIndex = "option index";

其中option index是下拉列表中要激活的选项的索引。

您可以使用以下方式获取选项的索引:

var selected = document.querySelector( '#'+div+' > option[value="'+val+'"]' );

其中div是

这是多么有用啊!

匿名用户

这会满足你的要求。

document.querySelector('[name="element"]').value = 4 // The value you want to select

这将检索值

var value = document.querySelector('[name="element"]').value; // 4

这解释了怎么回事

var option = document.querySelector('[name="element"]');//option element
    option.value; // 4
    option.selectedIndex; // 4
    option.selectedOptions; // [<option value="4">C</option>]
    option.selectedOptions[0].innerText; // C
    option.selectedOptions[0].value; // 4

请记住,selectedOptions是一个数组,因为可能会选择多个选项,在这些情况下,您必须在数组中循环以获取每个值。根据Hanlet Escaño的评论,确保您的代码设置为在加载DOM后执行。

window.onload = function() {  
    document.querySelector('[name="element"]').value = 0; // sets a default value   
}