jQuery UI手風琴在第一次調用後對後續調用進行初始化

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查詢到從服務器獲取數據，填補格「foo」的使用jqote2和初始化的「富」的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(); 

您可能需要計算當前手風琴的項目，如果你想保持這種狀態。