jquery手風琴部分ajax頁面重新加載後損壞

Question

我正在使用jquery手風琴，它在初始頁面加載時工作正常，但後來我有一些ajax命令重新加載頁面的一部分，實質上是頁面的內部主體。

當發生這種情況時，手風琴被打破了，因爲我所做的更新只是取代幾乎整個身體領域的innerHTML。

加載手風琴的腳本也包含在被替換的HTML中，但顯然這並沒有幫助。

如何在替換整個頁面的innerHTML後保留（或重新調用）手風琴效果？

<div class="art-Post-inner" id="ajaxWrapper"> 
     <div id="accordion"> 
       <h3><a href="#">Skärm 1</a></h3> 
       <div> 
        my accordion content 
       </div> 
     </div> 

     <script> 

      $(document).ready(function() { 
       $('#accordion').accordion({ 
        collapsible: true, active: false, autoHeight: false 
       }); 
      }); 

     </script>   

這是通過設置id = ajaxWrapper的div的innerHTML完全取代的藝術。

我相信你會發現問題。

Answer 1

把jQuery的手風琴功能在.ajax請求的成功回調：

例子：

var accordionOpts = { 
    collapsible: "true", 
    active: "false", 
    autoHeight: "false" 
    }; 

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

$("#replaceContent").click(function() { 
    $.ajax({ 
     type: 'POST', 
     cache: false, 
     data: { 
      html: "<div id='accordion'><h3><a href='#'>Skärm 2</a></h3><div>my accordion content</div></div>" 
     }, 
     url: '/echo/html/', 
     success: function(data) { 
      $(".art-Post-inner").html(data); 
      $('#accordion').accordion(accordionOpts); 
     } 
    }); 
}); 

小提琴：http://jsfiddle.net/6Scgc/3/

Answer 2

使用$（ 「.selector」）.accordion（「刷新「）;