Изменение имени класса Событие в jQuery

Question

Есть ли способ вызвать событие в jQuery при изменении классов элементов?

Примеры:

<img class="selected" />

в

<img class="selected newclass" />

вызывает событие

---

И

<img class="selected" />

в

<img class="" />

вызвать событие

Answer 1

Возможно, вы сможете обойти немного хакерский путь. Hook .addClass () & .removeClass () примерно так:

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

Таким образом, предполагая, что вам просто интересно наблюдать за изменениями классов элементов с помощью jQuery , вы можете запускать любой код в классах adding или removing. Опять же, просто если вы используете jQuery, для этого примера.

Конечно, вы можете hook и overwrite любой функцией JavaScript таким образом.

Как упомянуто в комментарии Nick Craver, есть несколько других методов jQuery, которые могут add или remove класса элементов. Вам нужно будет hook все из них, а именно:

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

Если вы не знаете точно, какие методы вызываются для манипулирования классом, вам придется заботиться обо всех них.

Answer 2

Я не думаю, что это возможно.

События основаны на действиях пользователя, поэтому click, dblclick, mouseover и т. Д. Являются действиями пользователя.

Возможно, вы захотите разработать какие-то данныезаблокируйте каждый элемент, а затем создайте небольшую систему, которая интегрируется в методы jQuery .class() и .attr(), чтобы при обновлении кода вашим классом он добавлял данные в этот элемент, содержащий предыдущий класс,

, а затем, еслипредыдущий класс отличается от устанавливаемого класса, а затем запускает ваши события.

То, что я имею в виду под интеграцией, это

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

, тогда вы можете сделать как

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

Надеюсьэто поможет вам