如何覆盖jQuery事件处理程序

78

我会尝试用简单的代码解释这个问题。

var fireClick = function() { alert('Wuala!!!') };

$('#clickme').click(fireclick);
$('#clickme').click(fireclick);

现在它显然会弹出两次警报,但我需要它只弹出一次。尝试了很多方法,但没有结果。

谢谢。


你能否提供一些关于为什么绑定事件的调用会发生两次的上下文信息?也许你可以通过稍微改变代码的功能来防止第二次调用。 - Mark Renouf
1
相关内容:https://dev59.com/cXVC5IYBdhLWcg3wsTfv - Crescent Fresh
22
就是这样,"Voila"。 :) - Mark Allen
2
请标记一个答案,如果它回答了你的问题,以便其他可能需要参考这个问题的用户受益。 - Sayan
6个回答

142
从 jQuery 1.7 开始,您应该使用 off 来删除事件处理程序,使用 on 来添加事件处理程序,尽管您仍然可以使用 click 简写。
$('#clickme').off('click').on('click', fireclick);
$('#clickme').off().on('click', fireclick);

如果你想替换所有的点击处理程序,请首先调用 unbind,不要使用函数参数。如果你想替换所有事件处理程序,请不要指定事件类型。
$('#clickme').unbind('click').click(fireclick);
$('#clickme').unbind().click(fireclick);

1
你赢了,因为你成功地链接了调用。但是也许可以优化一下你的答案,只删除重新添加的特定处理程序?所以:$('#clickme').unbind('click', fireclick).click(fireclick) - Mark Renouf
4
问题是“覆盖 jQuery 事件处理程序”——我假设他想要全部替换。为了做到这一点,他需要每次调用 unbind(这就是为什么我在两个上都重复了调用),并且不指定函数参数。 - tvanfosson
3
当您回答问题时,这绝对是正确的方法,所以我已经点赞了。话虽如此,我认为“新的和改进的”方法是使用on()和off()方法。由于这个答案是搜索“jquery替换事件处理程序”的第一个谷歌结果,因此将其添加到您的答案中可能会有所帮助。$('#clickme').off('click').on('click', fireclick);或者简单地写成$('#clickme').off('click').click(fireclick); - chucksmash
@IamChuckB 谢谢你的更新,我已经将其添加到我的答案中。 - tvanfosson

25

使用命名空间确保您不会删除其他侦听器:

$('#clickme').off('click.XXX').on('click.XXX', fireclick);

只要没有其他代码使用XXX,你就可以确信你没有搞砸自己不知道的其他行为。

18
您可以使用jQuery函数unbind来移除第一个事件:
var fireClick = function() { alert('Wuala!!!') };

$('#clickme').click(fireclick);
$('#clickme').unbind('click', fireClick); // fireClick won't fire anymore...
$('#clickme').click(fireclick); // ...but now it will

3

我会尽力消除多余的调用,但如果无法做到,您可以确保每次都调用这两个:

$('#clickme').unbind('click', fireclick);
$('#clickme').click(fireclick);

1
$(document).off('click', '#clickme').on('click', '#clickme', fireclick);

-11
你应该使用setInterval。问题在于你不能同时弹出两个警报框。第一个必须先关闭,否则第二个无法显示在屏幕上...

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接