如何检查事件处理程序是否已绑定到元素？

Question

我使用jQuery将事件处理程序绑定到元素，但也许还有一种方法可以使用普通的JavaScript进行检查......

如果我使用如下所示的代码，是否有办法测试元素是否已添加事件处理程序？当我再次运行该函数时（更新img src），然后第二次绑定事件，然后是第三次绑定等等。最简单的方法是什么？

$(window["tdImg_"+i]).add(window["tdImgSize_"+i]).bind('click', toggleImageSize);

Answer 1

这是一个解决方案：

$(window["tdImg_"+i]).each(function(){
    if(!this.boundToggleImageSize){
        $(this).bind('click', toggleImageSize);
        this.boundToggleImageSize = true;
    }
});

这样，您就不必解除所有点击事件的绑定（如果您对相同的元素有不同的绑定功能）。

修改

正如millimoose在评论中所建议的那样：

$(window["tdImg_"+i]).each(function(){
    if(!$(this).data("boundToggleImageSize")){
        $(this).bind('click', toggleImageSize);
        $(this).data("boundToggleImageSize",true);
    }
});

Answer 2

最简单的方法是unbind事件再次重新bind：

$(window["tdImg_"+i]).add(window["tdImgSize_"+i]).unbind('click').bind('click', toggleImageSize);

否则，您必须使用events访问$(el).data("events")数据，并手动检测事件是否已绑定。另请注意，此方法会排除inline事件处理程序。