如何在 AJAX 内容加载后重新附加 jQuery 函数？

Question

我以这种方式调用了一些 jQuery UI 函数：

jQuery(document).ready(function(){
    jQuery(".accordion").accordion();
});

但是我的页面是基于 AJAX 的，有些页面可能会使用手风琴，有些可能不会使用它。大约有 30 多个其他功能需要重新附加，这是一个有问题的开发任务。有没有什么聪明的方法来解决这个问题，以便每个新的.accordion都自动附加？

可能的解决方案以及为什么它们不起作用：

• 在 AJAX 调用完成时触发文档准备就绪是理想的，但这是不可能的
• 拥有load()不是一个选项，因为它是一个 CMS，用户可以在其中安装插件 - 这意味着插件添加的未知功能数量未知jQuery(document).ready();
• 重新附加功能ajaxComplete- 使用未知数量的未知功能，每次安装或卸载 jQuery 插件时，如果不修改 AJAX 脚本，这将无法工作

Answer 1

您可以使用该DOMNodeInserted事件并检查手风琴类。

document.addEventListener('DOMNodeInserted', function(e) {
    var el = $(e.target);
    if(el.hasClass('accordion')) {
        el.accordion();
    }
});

DOMNodeInserted 的使用示例：http : //jsfiddle.net/qErHs/