Question

步骤1：加载带有div“foo”和jqote2模板“tmpl_foo”的网页（jqote2是基于jQuery的模板系统）。

<div id="foo"></div>

<script type="text/x-jqote-template" id="tmpl_foo">
    <![CDATA[
    <% for (i in this.bar) { %>
            <h3><%= this.bar[i].title %></h3>
            <div class="pane"><%= this.bar[i].desc %></div>
    <% } %>
    ]]>
</script>

步骤2：通过jQuery触发ajax查询以从服务器检索数据，使用jqote2填充div“foo”，并在“foo”上初始化jQuery UI手风琴。

var get_foo : function () {
    $.ajax({
        url     : url,
        type    : "GET",
        data    : "",
        dataType: "json",
        error   : function() { alert("Error loading html document"); },
        success : function(res) {
            $("#foo").empty().append(
                $('#tmpl_foo').jqote({
                'bar': res.bar
                }) 
            ).accordion();
        }
    });
}

$(document).ready(function() {
    get_foo();
});

效果很好。

在网页上我还有其他链接，例如“上一页”和“下一页”（标准寻呼机功能）也会触发get_foo()。这些操作也会导致正确获取新数据，并且新结果也会正确插入“foo”。但是，由于某些原因，手风琴没有被初始化。我很难过。原因是什么？

Answer 1

你必须先重置手风琴：

        $("#foo").empty().append(
            $('#tmpl_foo').jqote({
            'bar': res.bar
            }) 
        ).accordion('destroy').accordion();

如果你想保持这种状态，你可能需要计算当前的手风琴项目。

jQuery UI手风琴在第一个后续调用之后初始化

1 个答案: