Necesito llamar a una función cuando se eliminó una clase de un elemento, no tengo control sobre cuándo se elimina la clase.
Actualmente puedo hacer que funcione usando setTimeout, por lo que es algo como:
function checkClassRemoval() { if (!$('.myElement').hasClass('mySecondClass')) { // run function } } setTimeout(checkClassRemoval, 1000);¿Hay una mejor manera de detectar la eliminación de la clase que ejecutar una verificación cada segundo?
Puede usar la clase MutationObserver para esto. Permite suscribirse a cambios de elementos DOM particulares y eventos de activación cuando ocurre este cambio:
var observer = new MutationObserver(function(mutations) { mutations.forEach(function(mutationRecord) { console.log('style changed!'); }); }); var target = document.getElementById('someId'); observer.observe(target, { attributes : true, attributeFilter : ['style', 'className'] });Para soporte de este objeto por favor refiérase a canIuse.com
Puede anular la función addClass/removeClass jQuery y extenderlos de esta manera:
(function(){ var nativeMethod= jQuery.fn.addClass; jQuery.fn.addClass = function(){ var result = nativeMethod.apply( this, arguments ); jQuery(this).trigger('cssClassChanged'); return result; } })(); //Your code: $(function(){ $("#yourElement").bind('cssClassChanged', function(){ console.log("triggered") }); });