绑定事件只有一次

我有以下代码：

function someMethod() { $(obj).click(function {}); } 

someMethod被调用两次，因此点击事件绑定了两次。 我怎样才能让它绑定一次？

Answer 1

如果你可以应用它，可能要看看event.preventDefault和event.stopPropagation或解除绑定每一次，在你的方法

 function someMethod() { $(obj).off('click').on('click', function(e) { // put your logic in here }); } 

Answer 2

除了pna的回答之外，您可能希望考虑命名您的活动，以避免意外地解除所有点击事件。

函数someMethod（）{
     $（obj）.unbind（'click.namespace'）。bind（'click.namespace'，function（）{}）;
 }

http://docs.jquery.com/Namespaced_Events

Answer 3

没有内置的方法来确定您是否已经绑定了这个特定的function。 您可以将多个点击function绑定到一个对象。 例如：

 $('#id').bind('click', function(){ alert('hello'); }); $('#id').bind('click', function(){ alert('goodbuy'); }); 

如果你点击这个对象的时候会发出警告，然后告别。 为了确保只有一个函数绑定到click事件解绑定click事件处理程序，然后绑定所需的函数，如下所示：

 $(obj).unbind('click').bind('click', function(){... }); 

Answer 4

显而易见的解决scheme是不要调用someMethod()两次。 如果你不能解决这个问题，那么你可以保留一个状态variables，所以它只能这样绑定一次：

 function someMethod() { if (!someMethod.bound) { $(obj).click(function() {}); someMethod.bound = true; } } 

注意：这使用了函数本身的一个属性，而不是引入一个全局variables来跟踪它是否被绑定。 你也可以在对象本身上使用一个属性。

你可以看到它在这里工作： http : //jsfiddle.net/jfriend00/VHkxu/ 。

Answer 5

jQuery使调用一些function可能只有一次很简单：

 function someMethod() { $(obj).click(function() {}); this.someMethod = $.noop; } 

Answer 6

或者使用jQuery的one（）函数，它类似于on（），但是只会触发一次事件，即使你绑定了多次。

http://api.jquery.com/one/

Answer 7

这是一个build议，因为我不知道你的逻辑。 可能会或可能不适合你。

尝试结合jQuery的生活（）和一个（）函数将给你比事件rebinds更好的结果。

当有2个DOM元素（父＆子）时，这些特殊情况就会起作用。 父节点上的Live（）函数确保事件将被调用，然后调用one（）来dynamic注册将只执行一次的事件。 （这提供了类似重新绑定的function）。

Answer 8

 var bound = false; function someMethod() { if(!bound) { $(obj).click(function {}); bound = true; } } 

但是我可能会研究为什么它会在做出某种解决方法之前被调用两次。

Answer 9

如果你只想绑定一次对象，你应该实现一个标志并坚持这个对象。

例如：

 if($('#id') && $('#id').data('done') == null)) { $('#id').bind('click', function() { alert('hello'); }); $('#id').data('done', true); } 

Answer 10

我也试图使用jquery的方法绑定事件只有一个dom元素不存在尚未或dom元素尚未创build。

 $('.select').off('event').on('event', 'selector', function(e){ // }); 

此代码无法正常工作

我遇到了一个非常有利可图的方法，那就是“一个”方法。 当你想要绑定一个事件时，这是非常有用的。

你可以在这里find这个文档http://api.jquery.com/one/

这与方法'on'相同，但是与其行为不同的是不同意多个select器的事件。

 $('body').one('click', 'selector', function(){ // do your stuff here }); 

Answer 11

您可以将CSS类添加到绑定的元素，然后将其过滤掉：

 function someMethod() { $(obj).not('.click-binded') .click(function {}) .addClass('click-binded'); } 

这个方法也可以用于插件：

  $(obj).not('.datetimepicker-applied') .datetimepicker() .addClass('datetimepicker-applied'); 

Answer 12

你可以使用这个jQuery扩展函数。

 $.fn.once = function (type, fn, uid) { if(uid == undefined) { console.error("Called $.once without uid\n", this, "\n", fn); } var dataStr = type+"-handler-"+uid; if(!this.data(dataStr)) { this.data(dataStr, true); this.on(type, fn); } }; 

而不是这样做

 $("button").on("click", function(){ alert("You Clicked On A Button"); }); 

雅做到这一点

 $("button").once("click", function(){ alert("You Clicked On A Button"); }, "btnHandler"); 

现在，当我有一个function

 function addBtnHandler() { $("button").once("click", function() { alert("You Clicked On A Button"); }, "btnHandler"); } 

我多次调用它

 addBtnHandler(); addBtnHandler(); addBtnHandler(); 

它只做一次。

请注意，扩展通过检查uid和types来工作。 这意味着你可以绑定不同types的处理程序与同一个用户ID，你可能会或可能不需要这个。 要改变它编辑。

var dataStr = type+"-handler-"+uid;

有类似的东西

var dataStr = "handler-"+uid;