Classe evento Change in jQuery

Question

C'è un modo per attivare un evento in jQuery quando un elementi classi sono cambiati?

Esempi:

<img class="selected" /> 

in

<img class="selected newclass" /> 

attiva un evento

---

E

<img class="selected" /> 

in

<img class="" /> 

attivare un evento

Answer 1

Potreste essere in grado di aggirare un po 'hacky . Hook.addClass() & .removeClass() in questo modo:

var _addClass = $.fn.addClass, 
    _removeClass = $.fn.removeClass; 

$.fn.addClass = function(){ 
    // do whatever here 
    return _addClass.apply(this, arguments); 
} 

$.fn.removeClass = function(){ 
    // do whatever here 
    return _removeClass.apply(this, arguments); 
} 

questo modo, si supponendo che sono solo interessati a guardare elementi cambiamenti di classe con jQuery, è possibile attivare qualsiasi codice sul adding o removing classi. Di nuovo, solo se stai usando jQuery, per questo esempio.

Ovviamente, è possibile hook e overwrite qualsiasi funzione javascript in questo modo.

come Nick Craver menzionato in un commento, ci sono molti altri metodi jQuery che possono add o remove una classe di elementi. Si dovrà hook tutti coloro, e cioè:

.addClass() 
.removeClass() 
.toggleClass() 
.removeAttr('class') 
.attr('class', 'changed') 

se non si sa esattamente quali metodi sono chiamati per manipolare una classe, si dovrebbe preoccuparsi di tutte quelle.

Answer 2

Non credo che questo sia possibile.

Gli eventi si basano sulle azioni dell'utente, quindi fare clic su, dblclick, mouseover ecc. Sono tutte azioni dell'utente.

Si consiglia di elaborare una sorta di blocco di dati su ogni elemento e poi costruire un piccolo sistema che si integra in jQuery .class() e .attr() metodi in modo che quando il codice aggiorna una classe si aggiungerà i dati a quell'elemento tenendo la classe precedente ,

Quindi se la classe precedente è diversa dalla classe impostata, attiva i tuoi eventi.

ciò che intendo per integrare è

var old_ClassFunc = $.fn.class; //Save it 

var $.fn.class = function() 
{ 
    if($(this).data('old-class')) 
    { 
     if($(this).data('class_callback'))# 
     { 
      $(this).data('class_callback')(this); 
     } 
    } 
    $(this).data('old-class',$(this).attr('class')); //Update Data 
    return old_class.apply(this,arguments); 
} 

allora si può fare come

$('element').data('class_callback',function(context){ 
    alert('Element class has changed'); 
}) 

Spero che questo ti dà un aiuto