javascript - 如何在 Javascript 的 SELECT 元素中设置或选择选项

Question

我有一个不属于我的网页，但我想获取 SELECT 元素的值。

例如:

    <select name="ctl00$MainContent$CldFecha$DdlAnio" id="DdlAnio" class="calendarCombo2" onchange="ValidateYear();" style="width: 60px; display: none;" sb="83980340">
    <option value="2011">2011</option>
    <option value="2012">2012</option>
    <option value="2013">2013</option>
    <option value="2014">2014</option>
    <option selected="selected" value="2015">2015</option>

当我单击按钮时，我想设置任何此选项，例如 2013。

我知道如何获取选定的值，这样做:

document.getElementById('DdlAnio').value

获取选定的索引:

document.getElementById('DdlAnio').selectedIndex

但是我认为基于 W3Schools，这些可能可以设置所需的选项:

document.getElementById('DdlAnio').value = "2013"
document.getElementById('DdlAnio').selectedIndex = "2"

但是什么也没发生，我做错了什么吗？

我也尝试过:

document.getElementById('DdlAnio').options[DdlAnio.selectedIndex].value = 2013

什么也没发生

Answer 1

我建议通过表单名称和元素名称来寻址。或者通过 getElementById()。

function setOption1() {
    document.form1['ctl00$MainContent$CldFecha$DdlAnio'].selectedIndex = 2;
}

function setOption2() {
    document.getElementById('DdlAnio').selectedIndex = 2;
}

<form name="form1">
    <select name="ctl00$MainContent$CldFecha$DdlAnio" id="DdlAnio">
        <option value="2011">2011</option>
        <option value="2012">2012</option>
        <option value="2013">2013</option>
        <option value="2014">2014</option>
        <option selected="selected" value="2015">2015</option>
    </select>
    <button onclick="setOption1()">setOption1</button>
    <button onclick="setOption2()">setOption2</button>
</form>