Hice un violín para demostrar mi problema.
Tengo problemas para desactivar una función activada por una clase, ¿alguna idea?
$(document).ready(function(){
$('.changeText').click(function(){
$(this).html( $(this).html() == 'Test' ? 'Changed' : 'Test' );
});
$('.changeBG').click(function(){
$(this).css('background-color', 'red');
});
/* in some cases I need to turn off changeBG function */
$('.changeBG').removeClass('changeBG');
// but if you click the div it still turns into red.
});
Gracias de antemano.
3 respuestas
Podría delegar el controlador de eventos a un antepasado común.
Al hacerlo, solo funcionará si ese elemento tiene esa clase específica porque se realiza una verificación cuando el evento click
realmente se dispara (en lugar de cuando se adjunta el controlador de eventos).
$(document).on('click', '.changeBG', function(){
$(this).css('background-color', 'red');
});
En el ejemplo anterior, document
es el ancestro común. Dependiendo de su marcado, es probable que desee cambiar eso al elemento ancestro constante más cercano para que el evento no se active cada vez que haga clic en document
.
Alternativamente, también puede usar el método .off()
y eliminar ese controlador de eventos específico utilizando espacios de nombres de eventos.
Puede adjuntar un evento click
específico llamado click.changeBG
:
$('.changeBG').on('click.changeBG', function(){
$(this).css('background-color', 'red');
});
Luego elimine ese evento específico usando .off('click.changeBG')
:
$('.changeBG').removeClass('changeBG').off('click.changeBG');
Esto se debe a que el controlador está asociado al elemento y no a la clase. La clase a la que se refirió al adjuntar es solo un filtro. Acabas de cambiar la clase. No es el evento que está asociado con él:
// Do this
$('.changeBG').removeClass('.changeBG').off("click");
O, cuando hace clic en verificar para la clase:
$('.changeBG').click(function(){
if ($(this).hasClass("changeBG"))
$(this).css('background-color', 'red');
});
Necesita eliminar el controlador directamente:
$('.changeBG').off('click')
Nota: off es jQuery 1.7+, de lo contrario use unbind
.
Lo que sucede es que la línea $('.changeText').click(...
adjunta un controlador a todos los elementos con la clase changeText
. Eliminar la clase no elimina el controlador.
Preguntas relacionadas
Nuevas preguntas
javascript
Para preguntas sobre la programación en ECMAScript (JavaScript / JS) y sus diversos dialectos / implementaciones (excepto ActionScript). Incluya todas las etiquetas relevantes en su pregunta; por ejemplo, [node.js], [jquery], [json], etc.