jquery предотвращает дублирование назначенной функции - PullRequest
24 голосов
/ 13 октября 2009

Если мне нужно динамически назначить функцию щелчка, есть ли способ убедиться, что функция щелчка назначается только один раз и не дублируется?

this.click(function(){
    alert('test');
})

Ответы [ 4 ]

43 голосов
/ 13 октября 2009

Вы можете отменить привязку события щелчка, прежде чем связать его снова, таким образом, к вам будет прикреплено только одно событие:

//assuming this is a jquery object.
this.unbind("click");
this.click(function(){
  alert("clicked once");
});

Начиная с jQuery 1.7, click теперь использует .on (http://api.jquery.com/click/), поэтому правильный код теперь

//assuming this is a jquery object.
this.off("click");
this.click(function(){
  alert("clicked once");
});

Это приведет к отмене привязки всех событий клика (включая те, которые созданы любыми плагинами, которые вы можете использовать). Чтобы убедиться, что вы отменяете привязку только к своему событию, используйте пространства имен. (http://api.jquery.com/off/)

//assuming this is a jquery object.
this.off("click.myApp");
this.on("click.myApp", function(){
  alert("clicked once");
});

Здесь myApp - пространство имен.

15 голосов
/ 01 июня 2012

С помощью jQuery .on () вы можете сделать что-то подобное:

//removes all binding to click for the namespace "myNamespace"
$(document).off('click.myNamespace'); 

$(document).on('click.myNamespace', '.selector', function(event) {...}); 

//this will be also removed (same namespace)
$(document).on('click.myNamespace', '.anotherSelector', function(event) {...}); 
9 голосов
/ 10 мая 2012

Я хотел бы добавить к ответу Мариуса -

Во избежание дублирования привязок вы не хотите случайно отсоединять что-либо, если предполагается, что к событию привязано более одной функции. Это особенно важно, когда вы работаете над чем-то с несколькими разработчиками. Чтобы предотвратить это, вы можете использовать пространство имен событий:

//assuming this is a jquery object.
var alertEvent = 'click.alert'
this.unbind(alertEvent).bind(alertEvent,function(){
  alert('clicked once');
});

Здесь «alert» - это имя пространства имен для вашего события щелчка, и только те функции, которые были связаны с этим пространством имен, не будут связаны.

0 голосов
/ 26 декабря 2015

при условии, что элементы добавляются в html, и вы хотите добавить событие только для добавленных элементов:

function addEvents2Elements()//prevent Duplicate
{
    //this will add the event to all elements of class="ele2addevent"
    $('.ele2addevent').not('.clickbind').on('click',function(){alert('once');})

    //this will add a class an then the class="ele2addevent clickbind"
    $('.ele2addevent').not('.clickbind').addClass('.clickbind');
    //all elements of class="... clickbind" will not be catched anymore in the first line because of .not() every time you call this function
}
addEvents2Elements();

будьте уверены, что вы добавляете только с class = "ele2addevent", потому что после привязки это будет class = "ele2addevent clickbind" и не перехватывается снова ...

...