如果你需要触发一个特定的事件，你可以重写addClass()方法来触发一个名为'classadded'的自定义事件。

这里有:

(function() {
    var ev = new $.Event('classadded'),
        orig = $.fn.addClass;
    $.fn.addClass = function() {
        $(this).trigger(ev, arguments);
        return orig.apply(this, arguments);
    }
})();

$('#myElement').on('classadded', function(ev, newClasses) {
    console.log(newClasses + ' added!');
    console.log(this);
    // Do stuff
    // ...
});

还有一种不触发自定义事件的方法

一个jQuery插件来监视Html元素CSS的变化

从上面引用

手表插件通过连接到FireFox中的DOMAttrModified来工作， 到onPropertyChanged在Internet Explorer，或通过使用计时器与 setInterval来处理对其他浏览器更改的检测。 不幸的是，WebKit不支持DOMAttrModified一致在 目前，Safari和Chrome不得不使用较慢的速度 setInterval机制。

我建议您重写addClass函数。你可以这样做:

// Create a closure
(function(){
    // Your base, I'm in it!
    var originalAddClassMethod = jQuery.fn.addClass;

    jQuery.fn.addClass = function(){
        // Execute the original method.
        var result = originalAddClassMethod.apply( this, arguments );

        // call your function
        // this gets called everytime you use the addClass method
        myfunction();

        // return the original result
        return result;
    }
})();

// document ready function
$(function(){
    // do stuff
});

如果您知道是什么事件首先改变了类，那么您可以对同一事件使用轻微的延迟，并检查类。 例子

//this is not the code you control
$('input').on('blur', function(){
    $(this).addClass('error');
    $(this).before("<div class='someClass'>Warning Error</div>");
});

//this is your code
$('input').on('blur', function(){
    var el= $(this);
    setTimeout(function(){
        if ($(el).hasClass('error')){ 
            $(el).removeClass('error');
            $(el).prev('.someClass').hide();
        }
    },1000);
});

http://jsfiddle.net/GuDCp/3/

无论何时在脚本中更改类，都可以使用触发器来引发自己的事件。

$(this).addClass('someClass');
$(mySelector).trigger('cssClassChanged')
....
$(otherSelector).bind('cssClassChanged', data, function(){ do stuff });

但除此之外，没有固定的方法在类更改时触发事件。Change()仅在focus离开输入已被更改的输入后触发。

$(函数(){ Var按钮= $('.clickme') ， box = $('.box') ； 按钮。On('点击'，函数(){ box.removeClass(盒); $(文档).trigger(“buttonClick”); })； 美元(文档)。on('buttonClick'，函数(){ box.text(“点击!”); })； })； .box {background-color:红色;｝ < script src = " https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js " > < /脚本> < div class = "盒子" >嗨< / div > <button class="clickme">点击我</button>

jQuery触发器的更多信息

如果您想检测类更改，最好的方法是使用Mutation observer，它可以让您完全控制任何属性更改。但是，您需要自己定义监听器，并将其附加到您正在监听的元素。好消息是，一旦追加了listener，您就不需要手动触发任何事情。

$(function() {
(function($) {
    var MutationObserver = window.MutationObserver || window.WebKitMutationObserver || window.MozMutationObserver;

    $.fn.attrchange = function(callback) {
        if (MutationObserver) {
            var options = {
                subtree: false,
                attributes: true
            };

            var observer = new MutationObserver(function(mutations) {
                mutations.forEach(function(e) {
                    callback.call(e.target, e.attributeName);
                });
            });

            return this.each(function() {
                observer.observe(this, options);
            });

        }
    }
})(jQuery);

//Now you need to append event listener
$('body *').attrchange(function(attrName) {

    if(attrName=='class'){
            alert('class changed');
    }else if(attrName=='id'){
            alert('id changed');
    }else{
        //OTHER ATTR CHANGED
    }

});
});

在本例中，事件监听器被附加到每个元素，但在大多数情况下您不希望这样(节省内存)。将这个“attrchange”监听器附加到你想观察的元素上。