javascript 如何使用jQuery更改onChange事件的调用函数
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/9928882/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How Change calling function of onChange event using jQuery
提问by Audumbar Bidave
I have this code which can display drop down in div tag of html. In this I have set one function "hello()" to that drop down through jquery but the problem is that its not calling that function.
我有这个代码可以在 html 的 div 标签中显示下拉列表。在此，我通过 jquery 将一个函数“hello()”设置为该下拉列表，但问题是它没有调用该函数。
<body>
<div id="content"></div>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$("#content").append('<select id="sel" onchange="fly()"><option value="1">Choose Me</option></select>');
$("#sel").attr("onchange", "hello()");
alert($("#sel").attr("onchange"));
function hello() {
alert("Hello");
}
function fly() {
alert("Go to fly");
}
</script>
</body>
回答by ShankarSangoli
You need this.
你需要这个。
$("#sel").change(hello);
回答by ShaneBlake
$("#sel").attr("onchange", hello);
EDIT :
编辑 ：
In case you missed it in all the near-identical answers, your original problem was that you put your function in quotes "hello()"rather than just using the function name to call it (ie hello)...
如果您在所有几乎相同的答案中都错过了它，那么您最初的问题是您将函数放在引号中，"hello()"而不仅仅是使用函数名称来调用它（即hello）...
回答by The Angry Saxon
You just need to wrap it in a jquery initialization
您只需要将其包装在 jquery 初始化中
$(function(){
$("#content").append('<select id="sel" onchange="fly()"><option value="1">Choose Me</option></select>');
$("#sel").attr("onchange", "hello()");
alert($("#sel").attr("onchange"));
function hello() {
alert("Hello");
}
function fly() {
alert("Go to fly");
}
});
回答by Curt
Use .change():
使用.change()：
$("#sel").change(function(){
hello();
});
Also wrap it in the jquery init function to ensure its ran after DOM has fully loaded:
还将它包装在 jquery init 函数中以确保它在 DOM 完全加载后运行：
$(function(){
$("#content").append('<select id="sel" onchange="fly()"><option value="1">Choose Me</option></select>')
$("#sel").change(function(){
hello();
});
});
回答by Neil Knight
I would suggest that you move:
我建议你搬家：
$("#content").append('<select id="sel" onchange="fly()"><option value="1">Choose Me</option></select>');
$("#sel").attr("onchange", "hello()");
alert($("#sel").attr("onchange"));
into a document ready function and remove the "s around hello, like so:
进入文档就绪函数并删除"s 周围hello，如下所示：
$(document).ready(function() {
$("#content").append('<select id="sel" onchange="fly()"><option value="1">Choose Me</option></select>');
$("#sel").attr("onchange", hello);
alert($("#sel").attr("onchange"));
});
This will allow the page to load, and then change the attribute.
这将允许页面加载，然后更改属性。
回答by Jivings
You're using jQuery. There's a shortcut for most things. It should be:
您正在使用 jQuery。大多数事情都有捷径。它应该是：
var hello = function() {
alert("Hello");
}
$("#sel").change(hello);
or
或者
$("#sel").change(function() {
alert("Hello");
});
It should also be in the document ready function. This is so it doesn't try and attach the event before the elements exist.
它也应该在文档就绪功能中。这样它就不会在元素存在之前尝试附加事件。
$(document).ready(function() {
// code here
});
回答by Jarry
I can't comment, but as the others said. the problem its that you are using $("#sel").attr("onchange", "hello()");instead of $("#sel").attr("onchange", hello);
我不能评论，但正如其他人所说。问题在于您正在使用$("#sel").attr("onchange", "hello()");而不是$("#sel").attr("onchange", hello);
This is because in JavaScript a function is a data type. So you have to work with high order functions
这是因为在 JavaScript 中，函数是一种数据类型。所以你必须使用高阶函数
If you want to understand better this I'd suggest to learn about functional programming.
如果您想更好地理解这一点，我建议您学习函数式编程。
Besides that, you should use jQuery methods to add event listeners. In this case $(.'#sel').change(hello);
除此之外，您应该使用 jQuery 方法来添加事件侦听器。在这种情况下$(.'#sel').change(hello);
