单击链接时将新部分添加到Jquery UI手风琴...？ （代码点火器）

Question

当有人点击同一页面或不同页面上的链接时，我想为Jquery UI手风琴添加新的部分。我查看了append（）函数，但我要提取的内容将包含PHP和HTML，因此需要对其进行解析。

用户点击的链接将引用数据库记录以便例如/ site / index / record / 3（我在Code Igniter中构建）。

最好的方法是什么？

我正在考虑使用prependTo（如果那是对的），然后通过ajax提取内容？不知道如何工作，但是从另一个页面点击。

任何想法，建议，指示或评论都表示感谢，因为我不知道如何做到这一点。

这是我的手风琴js：

$(function() { // jquery ui accordion with mods for sorting
    var stop = false;
    $("#ccaccordion h3").click(function( event ) {
        if ( stop ) {
            event.stopImmediatePropagation();
            event.preventDefault();
            stop = false;
        }
    });

    $("#ccaccordion")
        .accordion({
            header: "> div > h3",
            autoHeight: false,
            change:
              function(event, ui){
                ui.newHeader.parent().prependTo(this); // move the active panel to the top of the accordion
              }
        })
        .sortable({
            axis: "y",
            handle: "h3",
            stop: function() {
                stop = true;
            }
        });

        $(".new_accordian").click(function( event ) {
        $('#ccaccordion').prepend("<div><h3><a href=\"#\">Section X</a></h3><div><p>Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In suscipit faucibus urna.</p></div></div>");
    });

});

谢谢！

Answer 1

我通过改变HTML来添加新的Accordion部分然后调用如下内容来完成此操作：

$("#days").accordion('destroy').accordion({
    autoHeight: false
    ,navigation: true
    ,collapsible: true
    ,active: false
});

其中<div id="days">...</div>是容纳所有手风琴部分的容器。基本上你必须销毁然后在添加新元素时重新初始化手风琴。

因此，您将通过AJAX获取新的部分，将HTML附加到手风琴容器，然后重新创建手风琴。