jquery 对选择/选项更改事件没有反应答案

【问题标题】：jquery does not react on select/option change eventjquery 对选择/选项更改事件没有反应
【发布时间】：2012-01-29 06:28:14
【问题描述】：

谁能告诉我错误在哪里，我只是看不到它。选择更改时，应将“e1 已更改”记录到控制台。

html:

<select name="e1" id="e1">
    <option value="1">1</option>
    <option value="2">2</option>
</select>

js:

$('#e1').change(function() {
    console.log('e1 has changed');
});

jquery 确实可以正常工作，因为我成功地“获取”了其他元素的服务器数据。

【问题讨论】：

代码看起来正确。你能详细说明什么不起作用，或者给出一个该代码不起作用的用例吗？
代码正确，不存在问题。你能进一步解释一下吗？
您的代码确实有效（将 console.log 更改为警报，以使这里的生活更轻松。）jsfiddle.net/NJskv

标签： jquery select handler option

【解决方案1】：

这段代码

$('#e1').change(function() {
    console.log('e1 has changed');
});

可能不在您的文档就绪处理程序中，因此在您的 dom 元素 e1 准备好之前运行。您可以创建一个文档就绪处理程序，它将在您的 dom 元素准备好时运行，就像这样

$(function() {
    $('#e1').change(function() {
        console.log('e1 has changed');
    });    
});

【讨论】：

【解决方案2】：

为我工作。这是 jsFiddle 代码 -

http://jsfiddle.net/CC5P6/

$(document).ready(function() {
  $('#e1').change(function() {
    alert('e1 has changed');
  });
});

【讨论】：

【解决方案3】：

你还没有这样做，你应该把你的代码包装在$(document).ready(：

 $(document).ready(function() {
    $('#e1').change(function() {
       console.log('e1 has changed');
    });
 });

【讨论】：

【解决方案4】：

这对我有用：

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
    $(function() {
        $('#e1').change(function() {
            console.log('e1 has changed');
        });
    });
</script>

</head>
<body>
<select name="e1" id="e1">
    <option value="1">1</option>
    <option value="2">2</option>
</select>
</body>
</html>

document.ready 是这里的关键，正如其他人所指出的那样。

【讨论】：

【解决方案5】：

对于选择菜单，当通过键盘和鼠标按钮事件选择选项时会发生更改事件，并且 NoScript 会有效地干扰。对于文本字段或文本区域，当字段失去焦点时会发生更改事件。因此您不能直接使用“更改事件”（无需通过键盘或鼠标选择任何选项）试试这个鳕鱼：

<select name="subpos" id="subpos">
<option value="examplel">examplel</option>
<option value="sample">sample</option>
<option value="fortest">fortest</option>
</select>


<script>
    $(function() {
        $('#subpos').change(function() {
            console.log('subpos has changed');
        }); 
        $("#subpos").val('sample');//combo box has change but dont appear in console log. why?
   });
</script>

运行后；查看控制台日志您在控制台日志中看不到“subpos has changed”。但实际上'subpos已经改变' 发生了什么？选择更改时，它应记录到控制台。现在通过从下拉列表中选择该选项，您可以看到 cosole 日志发生了变化

【讨论】：