動的に追加されたタブではアコーディオンが動作しません

Question

動的に追加されたタブにアコーディオンを追加したいと思います。このタブは、サーバーからのポストバックデータによって生成されます。これで何をすべきですか？

ポストバックデータは、私はタブが追加される前に

$("#accordion1).accordion(); 

を持って

<div id ="newtab"> 
<div id = "accordion"> ...</div> 
... 
</div> 

のようなものですが、それが動作していません。

Answer 1

すでに問題の問題を特定してきたように思える：タブの前に

$("#accordion1).accordion();

をに追加されますが、それは動作しません。

新しい要素がDOMに追加された後（つまり、AJAX呼び出しのsuccess関数）に、再度アコーディオンを初期化する必要があります。

jQueryセレクタ$("#accordion")は、現在ドキュメントにある要素のみを選択しています。 .livequeryのようなプラグインを使用して、新しい要素に自動的に必要な機能を呼び出すことができます。あなたは上記のlivequeryプラグインを使用するのではなくていない場合

---

は、ここでの例です：

$("#accordion").livequery(function() { 
    $(this).accordion(); 
}); 

これは、任意の要素がアコーディオンにid#accordionでDOMに追加いたします。

例：http://jsfiddle.net/andrewwhitaker/HBFnJ/

Answer 2

私はこの記事に出くわしたとき、私は同様の問題への解決策を探していました。しかし、ここではプラグインをインポートする必要があります。
私は別のオプションを試してみました。

動的データが追加されたときに、アコーディオンのdestroyメソッドを呼び出します。このように：

.accordion("destroy"); 

と同じオプションで再びアコーディオンを初期化し、以前のdivに適用:)