Question

作为javascript的新手，我有两个html数字选择，包括年份，我想用第一个选择第二个选择，当我在第一个选择中选择一年时（第二个选择没有选项）第一个），第二个选择应包括从所选数字到当前年份的年份。

我的示例HTML代码：

<select id="1st select" onchange="generate_selectNumbers()">
<option value="choose" selected>choose a year</option>
<option value="2000">2000</option>
<option value="2001">2001</option>
<option value="2002">2002</option>
</select
<select id="2nd select">
</select>

我的javascript代码：

<script>
function generate_selectNumbers(){ 
var a = document.getElementById("1st select");
var b = document.getElementById("2nd select");
var i = a.options[a.selectedIndex].value;
var d = new Date();
var n = d.getFullYear();
for (i , i <= n, i++){
    b.options[b.options.length]= new Option('i', 'i');
    }
}
</script>

每当我从第一次选择中选择一年时，第二次选择都不会发生任何事情并保持空白。我感谢你纠正我的js代码或提供新的代码，如果我的完全错误。或者我应该使用ajax进行第二次选择以使用新选项自动刷新？提前谢谢。

Answer 1

我已经修改了一些代码并且似乎有效。这是工作的.html文件。我还建议您使用更详细的变量名称。

这是JSFiddle

编辑：更新以在插入新选项之前清除第二个选项。

<html>
   <head>
      <script type="text/javascript">
         function generate_selectNumbers()
         { 
           var a = document.getElementById("selOne");
           var b = document.getElementById("selTwo");

           // clear options in second select
           for (var option in b) {
               b.remove(option);
           }

           var i = a.options[a.selectedIndex].value;
           var d = new Date();
           var n = d.getFullYear();
           for (i; i <= n; i++){
               b.options[b.options.length]= new Option(i, i);
           }
         }
      </script>
   </head>
   <body>
      <select id="selOne" onchange="generate_selectNumbers()">
         <option value="choose" selected>choose a year</option>
         <option value="2000">2000</option>
         <option value="2001">2001</option>
         <option value="2002">2002</option>
      </select>
      <select id="selTwo">
      </select>
   </body>
</html>

链接的html编号选择

1 个答案: