使用 javascript 更新 html <select> 标签

Updating the html <select> tag using javascript

本文关键字:select 标签 javascript html 使用 更新      更新时间:2023-09-26

[solved]所以我下面的代码应该使用 id="country" 检查第一个下拉选择菜单的值,并根据当前选择的值更改第二个菜单的下拉选项。以下是我解决此问题的尝试,但它不起作用:(有什么帮助吗?

编辑:我开始认为"var country"的值在手动更改时没有更新,可能是onChange不起作用吗? 我正在使用Chrome,所以应该支持它。

     <div id="forum2">
     <form action="#forumhandler.php">
       <fieldset>
       <legend>Shipping Calculator</legend>
       Country:<br>
          <select id="country" onChange='fieldcheck()'>
           <option value="us">United States</option>
           <option value="canada">Canada</option>
          </select>
       <br><br>
       Province/State:<br>
        <select id="state" >
          <option value="s1">Ontario</option>
          <option value="s2">Quebec</option>
        </select>
       </fieldset>
    </form>
    </div>
<script>
        var country = document.getElementById("country");
        var state = document.getElementById("state");
        function fieldcheck() {
            if (country.value == "us") {
                state.options[0].value = "U1";
                state.options[1].value = "U2";
            } else if(country.value == "canada"){
                state.options[0].value = "C1";
                state.options[1].value = "C2";
            }
        }
    </script>

尝试将脚本标签放在结束正文标签之前。在其当前位置,它试图确定状态的值,该值为 null,因为当该文档选择器行运行时,ID 为"state"的元素不存在。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script>
$(document).ready(function(){
    var country = document.getElementById("country");
    var state = document.getElementById("state");
});
function fieldCheck() {
    if (country.value == "us") {
       state.options[0].value = "U1";
       state.options[1].value = "U2";
    } else if(country.value == "canada"){
        state.options[0].value = "C1";
        state.options[1].value = "C2";
    }
     alert("first option value is " + state.options[0].value + " and second option value is " + state.options[1].value);
}
</script>

这是适合您的工作代码。 希望对您有所帮助