Javascript For循环更改jQuery中下拉菜单的值

我现在有一个下拉菜单，列出了从1970年到现在的所有年份。目前，这是在HTML中的一些嵌入式JavaScript中实现的。我试图使用一个外部文件来执行与jQuery相同的功能，但遇到了困难

这是显示下拉菜单的当前方法：

<h4 class="form_title">Time Span</h4></br>
<label for="select" class="col-lg-2 control-label">From:</label>
<div class="col-lg-3">
    <select class="form-control" name="timeStart" id="select">
        <option value="" selected disabled>Select</option>
        <script type="text/javascript">
            // get current year and then use loop to populate options
            var year = new Date().getFullYear();
            for(i = year; i >= 1970; i--) {
                document.write('<option value="' + i + '">' + i + '</option>');
            };
        </script>
    </select>
</div> <!-- col-lg-3 -->

这很好，但我想将逻辑与视图分开。我已尝试从该文件中完全删除脚本，然后在JavaScript文件中添加以下内容，如下所示：

var year = new Date().getFullYear();

$("#select").change(function() {
    console.log("Calling function successfully...");
    for(i = year; i >= 1970; i--) {
        document.write('<option value="' + i + '">' + i + '</option>');
    }
});

我将console.log放在那里，以查看在选择菜单时是否调用了该函数。我已经尝试了很多不同的方法，但无法找出我做错了什么，可能有几件事。我应该选择select标记还是option标记？

将代码移动到就绪状态，然后使用append向select添加选项

var year = new Date().getFullYear();

$(document).ready(function () {
    console.log("Calling function successfully...");
    var options = '';
    for (i = year; i >= 1970; i--) {
        options += '<option value="' + i + '">' + i + '</option>';
    }

    $('#select').append(options);
});

---

您需要将要作为子级渲染的选项附加到select元素：

$(document).ready(function() {
    console.log("Calling function successfully...");
    var options = ''
    for(i = year; i >= 1970; i--) {
        options += '<option value="' + i + '">' + i + '</option>';
    }
    $("#select").append(options);
});

---

因为您使用的是JQuery，所以需要确保将代码包装在$document.readyfunction{}

如果您不这样做，它将尝试在加载时立即运行。将其包装成这样将确保在尝试运行代码之前呈现选择框

你可以在这里看到一个例子

$document.readyfunction{ var sel=$‘选择’； 风险值起始年=1970年； forvar i=start_year；i另一个使用while循环的版本

---

对于var i=year；请！它将是当前年份。var year=new Date.getFullYear；@Tushar它不会替换最初呈现的选项。感谢大家的帮助。我忘记添加$document.readyfunction{bit，但JavaScript已经包装在其中。感谢您的帮助，它现在可以工作了。

var year = new Date().getFullYear(), $options = $();
while (year >= 1970) {
    var option = year--;
    $options = $options.add($('<option/>', { 'value': option, 'text': option }));
}
$('#select').append($options);