jquery prevent duplicate function assigned

Question

Si necesito asignar dinámicamente una función de clic, ¿hay alguna forma de garantizar que la función de clic solo se asigne una vez y no se duplique?

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

Answer 1

Puede desenlazar el evento de clic antes de enlazar de nuevo, de esa manera sólo tendrá un evento que se le atribuye:

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

A partir de jQuery 1.7, haga clic ahora utiliza .on (http://api.jquery.com/click/) por lo que el código correcto es ahora

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

Esto desvincular todos los eventos de clic (incluidas las creadas por los plugins de que utilices). Para asegurarte de que solo desvinculas tu evento usa espacios de nombres. (http://api.jquery.com/off/)

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

Aquí myApp es el espacio de nombres.

Answer 2

me gustaría añadir a answer--

para evitar atascamientos duplicados de Marius que no desea para desenlazar accidentalmente algo si no se supone que hay más de una función ligada a un evento. Esto es especialmente importante cuando trabajas en algo con múltiples desarrolladores. Para evitar esto, puedes usar espacios de nombre del evento:

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

Aquí 'alerta' es el nombre del espacio de nombres para su evento de clic y sus funciones se han enlazado con ese espacio de nombres será unido.

Answer 3

con jQuery .on() que puede hacer algo por el estilo:

//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) {...}); 

Answer 4

suponiendo que los elementos se agregan a la html y que desea añadir un evento sólo para elementos añadidos:

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(); 

sea Asegúrese de agregar solo con la clase = "ele2addevent", porque después del enlace será class = "ele2addevent clickbind" y no se volverá a atrapar ...