Javascript jQuery:未触发事件侦听器
我正在尝试使用Jquery向html元素添加事件侦听器 test.html 现在当我打开file:///home/ronnie/check/popup.html 如果我选择任何一个选项，我的jquery函数都不会被触发，我只会得到函数外的弹出窗口 我在JSFIDLE中尝试了相同的代码，效果非常好 所以，我的问题是为什么它在chromium中不起作用。您在test.js中选择$options，它在构建之前在标记中定义。jQuery有一个函数，可以等待所有内容都构建完成，以便您可以选择元素：Javascript jQuery:未触发事件侦听器,javascript,jquery,Javascript,Jquery,我正在尝试使用Jquery向html元素添加事件侦听器 test.html 现在当我打开file:///home/ronnie/check/popup.html 如果我选择任何一个选项，我的jquery函数都不会被触发，我只会得到函数外的弹出窗口 我在JSFIDLE中尝试了相同的代码，效果非常好 所以，我的问题是为什么它在chromium中不起作用。您在test.js中选择$options，它在构建之前在标记中定义。jQuery有一个函数，可以等待所有内容都构建完成，以便您可以选择元素： $(d
$(document).ready(function() {
// contents of test.js
});
您是否已将更改功能放入documentready中 试试这个
alert("outside function");
$(document).ready(function(){
$('#options').change(function() {
alert("inside function");
var x = $('#options option:selected').text();
alert(x);
});
});
DOM尚未加载。您需要使用.ready函数-
我怀疑原因可能是： 在html文件中执行此操作时，尚未定义选项select标记，因此onchange函数未正确注册。因此，请在定义select标记后重试
或者选择$document.readyfunction{}，它将提供所需的结果。将代码放入$document.ready中
$(document).ready(function(){
alert("outside function");
$('#options').change(function() {
alert("inside function");
var x = $('#options option:selected').text();
alert(x);
});
})
使用此代码可以正常工作，请确保始终在之后编写
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<select id="options" >
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select>
<script>
$('#options').change(function() {
alert("inside function");
var x = $('#options option:selected').text();
alert(x);
});
</script>
</body>
</html>
它在我的电脑中运行良好这可能是原因，所以你的答案是一个解决方案。实际上，jQuery为您编写的内容提供了一个快捷方式：$function{…}；而不是$document.readyfunction{…}；。抱歉，直到我输入其他人的答案时，我才得到任何更新。@AmitKhanna:因为事情发生得很快。不能仅仅因为回答问题的人比第一个回答问题的人晚几秒就判断他/她是否回答了问题。@roXon:MattG在第一个回答问题后5秒回答了问题，我想你的评论在这里是毫无意义的。@roXon:看一下时间戳。
alert("outside function");
$(function(){
$('#options').change(function() {
alert("inside function");
var x = $('#options option:selected').text();
alert(x);
});
});
$(document).ready(function(){
alert("outside function");
$('#options').change(function() {
alert("inside function");
var x = $('#options option:selected').text();
alert(x);
});
})
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<select id="options" >
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select>
<script>
$('#options').change(function() {
alert("inside function");
var x = $('#options option:selected').text();
alert(x);
});
</script>
</body>
</html>