Javascript jQuery .change() 事件是在较新版本中使用 .click() 触发的吗?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/6349447/
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
jQuery .change() event is triggered with .click() in newer versions?
提问by Jared Cobb
I'm currently upgrading my application to use jQuery 1.6.1 (previously using 1.4.4) and found that now the .click()
event automatically triggers a .change()
event as well.
我目前正在升级我的应用程序以使用 jQuery 1.6.1(以前使用 1.4.4)并发现现在该.click()
事件.change()
也会自动触发一个事件。
I created a simple example here: http://jsfiddle.net/wDKPN/
我在这里创建了一个简单的例子:http: //jsfiddle.net/wDKPN/
Notice if you include 1.4.4 the .change()
function will notfire when the .click()
event is triggered. But when switching to 1.6, the .change()
event isfired when .click()
is triggered.
请注意,如果您包含 1.4.4,该.change()
函数将不会在.click()
触发事件时触发。但是当切换到 1.6 时,.change()
事件会在.click()
被触发时被触发。
Two questions:
两个问题:
Is this a bug?It seems that programmatically triggering
.click()
shouldn'talso fire other events (for example, it would seem wrong to also automatically fire.blur()
and.focus()
, to help "mimic" a user's click).What is the proper way for me to bind a
change()
event and thentrigger bothaclick()
andchange()
event for that element?Do I simply call.click()
, and rely on the fact that.change()
will also fire?$('#myelement').change(function() { // do some stuff }); $('#myelement').click(); // both click and change will fire, yay!
这是一个错误吗?似乎以编程方式触发
.click()
不应该同时触发其他事件(例如,自动触发.blur()
和.focus()
, 以帮助“模仿”用户的点击似乎是错误的)。什么是我绑定的正确方法
change()
事件,然后触发这两个一click()
和change()
事件为元素?我是否只是简单地调用.click()
,并依赖于.change()
也会触发的事实?$('#myelement').change(function() { // do some stuff }); $('#myelement').click(); // both click and change will fire, yay!
In my old code I'm using this pattern to initialize some checkboxes (and their checked states and values) after an ajax call:
在我的旧代码中,我使用此模式在 ajax 调用后初始化一些复选框(及其选中的状态和值):
$('#myelement').change(function() {
// do some stuff including ajax work
}).click().change();
But in 1.6.1 my logic fires twice (once for .click()
and once for .change()
). Can I rely on just removing the .change()
trigger and hope that jQuery continues to behave this way in future versions?
但是在 1.6.1 中,我的逻辑触发了两次(一次 for.click()
和一次 for .change()
)。我可以依靠删除.change()
触发器并希望 jQuery 在未来版本中继续以这种方式运行吗?
采纳答案by Shef
Best way to do this is:
最好的方法是:
$('#myelement').bind('initCheckboxes change', function() {
// do some stuff including ajax work
}).trigger('initCheckboxes');
To do your initialization stuff you just bind to it a custom event, which you trigger it the first time the page loads. This, no one will take away from you on any versions.
要进行初始化工作,您只需将自定义事件绑定到它,在第一次加载页面时触发它。这一点,没有人会从任何版本中夺走你。
Whereas change
event, I believe, will continue to be there on all versions, because it has been for so long, and it just works nicely that way.
而change
我相信 event 将继续存在于所有版本中,因为它已经存在了很长时间,而且它只是以这种方式很好地工作。
In the end, this is a happy ending story, because the custom event initCheckboxes
will fire just once on page load and change
event will always listen and fire on change state.
最后,这是一个圆满的结局,因为自定义事件initCheckboxes
只会在页面加载时触发一次,而change
事件将始终监听并在更改状态时触发。
回答by Josiah Ruddell
I would say this was a bug in jQuery 1.4.4. Removing the jQuery event handlers and using standard addEventListener
produces the same result as jquery 1.6.1.
我会说这是 jQuery 1.4.4 中的一个错误。删除 jQuery 事件处理程序并使用标准addEventListener
会产生与 jquery 1.6.1 相同的结果。
http://jsfiddle.net/jruddell/wDKPN/26/
http://jsfiddle.net/jruddell/wDKPN/26/
window.count = 0;
document.getElementById('mycheckbox').addEventListener('change', function() {
window.count++;
jQuery('#output').append('I fired: ' + window.count + ' times<br />');
});
document.getElementById('mycheckbox').click();
Also I would use triggerHandler
to specifically invoke a jQuery event handler. If you want the event model to determine which handlers to call, then use click
, change
etc.
另外我会triggerHandler
用来专门调用一个 jQuery 事件处理程序。如果你希望事件模型来确定调用哪个处理程序,然后使用click
,change
等等。
回答by zupa
Forget about the click event for checkboxes. The change event handles everything.
忘记复选框的点击事件。change 事件处理一切。
$('#myelement').change(function() {
// do some stuff
});
$('#myelement').trigger('change');
See for yourself: http://jsfiddle.net/zupa/UcwdT/(This demo is set to jQuery 1.8 but works in 1.6 as well.)
亲自查看:http: //jsfiddle.net/zupa/UcwdT/(此演示设置为 jQuery 1.8,但也适用于 1.6。)
回答by kwicher
I think you can make it work for both jQuery 1.4.4 and 1.6 implementations by putting change() within click handler and then triggering the click.
我认为您可以通过将 change() 放在单击处理程序中然后触发单击来使其适用于 jQuery 1.4.4 和 1.6 实现。
$('.myelement').click(function(){
$('.myelement').change();
alert($(this).val());
});
$('.myelement').trigger('click');
Have a look therefor simple example.
看看那里的简单例子。