在回调时重新初始化jquery手风琴

Question

我的手风琴在页面加载方面运行良好，但是当用户与页面上的某些元素进行交互时，我使用ajax来重建手风琴的HTML。然后，我尝试用

重新初始化手风琴

    $('#accordion').accordion({
        active: false,
        autoHeight: false,
        clearStyle: true,
        collapsible: true,
        header: 'h3'
    });

但......似乎没有采取。

新呈现的HTML块未应用手风琴规则。相反，它只是作为一个大型列表保持开放。

我甚至尝试过setTimeout（）来重新调用手风琴，只是因为它在回调中返回呈现的HTML之前尝试初始化。

在回调中呈现的HTML与pageload的HTML完全相同（除了在Accordion方法生效时发生的DOM添加）

Answer 1

在用数据填充之前销毁手风琴。

$('#accordion').accordion('destroy');

Answer 2

对我来说，以下内容可以很好地工作并且代码非常清晰-使用以下命令在页面加载中启动手风琴div：

$('#accordion').accordion()

然后我进行任何更改：

$('#accordion').accordion( "refresh" )

---

来自Docs：

  

处理直接在DOM中添加或删除的所有页眉和面板，并重新计算手风琴面板的高度。结果取决于内容和heightStyle选项。

这适用于所有情况：这意味着您可以在添加/删除/更改/重新创建内容后使用它，并且“ accordion”元素将重新调整自身。

您应避免在每次更改时破坏和创建所有内容，这样做没有意义，并且随着规模的扩大，性能可能会下降。