如何在jQuery的addClass方法中添加回调函数？答案

【问题标题】：How to add a callback function to the addClass method of jQuery?如何在jQuery的addClass方法中添加回调函数？
【发布时间】：2017-01-23 17:32:24
【问题描述】：

我正在使用来自 Google 和 Markdown 的 Prettify，并且我希望每次在 markdown textarea 中添加一个 pre 代码来再次调用 prettyPrint() 函数。

这是我的实际代码：

if($('#wmd-preview').length > 0) {
  $('#wmd-preview').on('DOMNodeInserted DOMNodeRemoved',function(){
    $(this).find("pre").not('.prettyprint').addClass("prettyprint");
  });
}

但我想要类似的东西：

$(this).find("pre").not('.prettyprint').addClass("prettyprint",function(){
  prettyPrint();
});

有什么办法可以做到吗？

【问题讨论】：

回调会做什么？什么时候调用？
可以看第二个例子。回调将调用函数 prettyPrint() ，该函数将样式添加到 Markdown 预览中插入的代码。每次发现没有prettyprint css 类的新pre 元素时都应该调用它。我不想每次都调用domnodeinserted 或domnoderemoved 事件，但仅限于上述情况。
addClass 没有回调。您是说要在每个 pre 获得 prettyprint 课程后运行 prettyPrint？
@MateiMihai 你可以用你自己的覆盖addClass 函数，这将触发一个自定义事件（但这在这里没有帮助，所以......）
It should be called each time is found a new pre element without a prettyprint 你的意思是当新的pre 元素添加到 DOM 时应该发生这种情况？

标签： jquery addclass

【解决方案1】：

你可以扩展.addClass() jquery 的方法，让它接受一个回调函数：

;(function ($) {
    var oAddClass = $.fn.addClass;
    $.fn.addClass = function () {
        for (var i in arguments) {
            var arg = arguments[i];
            if ( !! (arg && arg.constructor && arg.call && arg.apply)) {
                setTimeout(arg.bind(this));
                delete arguments[i];
            }
        }
        return oAddClass.apply(this, arguments);
    }

})(jQuery);

然后照常使用：

 $('pre:not(.prettyprint)').addClass('prettyprint',prettyPrint);

【讨论】：

这很好，只是它在回调执行后添加了.prettyprint。回调应该在核心事件完成后触发（例如fadeIn()）。
@jacob 更新它以在事件队列中推送回调并设置相关的回调上下文，谢谢！

【解决方案2】：

据我了解，您需要这个：

$(this).find("pre").not('.prettyprint').each(function(){
   $(this).addClass("prettyprint");
   prettyPrint();
})

【讨论】：

【解决方案3】：

addClass jQuery 函数在参数中没有回调。

在documentation 中了解更多信息。

我认为这对你有用：

// prettyprint class is added
$(this).find("pre").not('.prettyprint').addClass("prettyprint");
// after prettyprint class is added, prettyPrint function is called
prettyPrint();

【讨论】：

谢谢，但我不想使用这个解决方案，因为每次在 markdown 容器中键入任何字符时都会调用 prettyPrint() 函数，这不是我想要的..跨度>