javascript - 下拉菜单中的 jQuery 更改事件

Question

我刚刚将查询库添加到我的网络应用程序并使用简单的警报进行了测试:

<script src="<c:url value="/resources/jquery-1.10.2.min.js" />"></script>
<script type="text/javascript">
            $(function(){
                alert('jquery is working');
            }); 
</script>

并且工作正常。但是，当我想在我的下拉列表中实现“更改”事件时

<script src="<c:url value="/resources/jquery-1.10.2.min.js" />"></script>
<script type="text/javascript">
        $("#projectKey").change(function() {
            alert($('option:selected', $(this)).text());
        });
</script>

它没有向我显示任何警报，基本上什么都没有发生。我的下拉列表如下:

<select id="projectKey" name="projectKey">
    <option value="AM">AM</option>
    <option value="AIL">AIL</option>
    <option value="NEB">NEB</option>
    <option value="SSP">SSP</option>
</select>

当然我试图简化 javascript，只是

$("#projectKey").change(function() {
            alert("test");
});

但还是不开心。它将与选择器或下拉列表有关。也试过“select#projectKey”，但结果当然是一样的。知道我做错了什么吗？

Answer 1

你应该保留 DOM 就绪函数

$(function() {
    $("#projectKey").change(function() {
        alert( $('option:selected', this).text() );
    });
});

如果您在 DOM 中的元素之前添加了 javascript，则文档未就绪，您必须使用 DOM 就绪函数或在元素之后添加 javascript，通常的位置是在 </body> 之前标签