0

私はここで単純な何かが欠けていると思います。最初はアコーディオンは問題ないように見えます。アコーディオンを置き換えるAjax呼び出しがありますが、置き換えた後はアコーディオンのようには見えません。問題は以下に蒸留されます。

フィドル： http： //jsfiddle.net/tzerb/5nJH7/

HTML：

<div id="theAcc">
    <h3><a href="#">1</a></h3>
    <div>One</div>
    <h3><a href="#">2</a></h3>
    <div>Two</div>
    <h3><a href="#">3</a></h3>
    <div>Three</div>    
</div>

​&lt;button id="btnReplace">Replace</button>​​​​​​​​​​​​​​​​​​

Javascript：

$(function() {
    $( "#theAcc" ).accordion();
});

​$("#btnReplace").click(function() {
    $("#theAcc").html("<h3><a href='#'>A</a></h3><div>AAAA</div><h3><a href='#'>B</a></h3><div>BBBB</div><h3><a href='#'>C</a></h3><div>CCCC</div>");
});​​​​​​​​​​​​

フィードバックをいただければ幸いです。

TIA。

4

2 に答える 2

6

これがあなたが見たい振る舞いをする更新されたjsFiddleです：http：//jsfiddle.net/5nJH7/5/

更新されたコードは次のとおりです。

$(function() {
    $( "#theAcc" ).accordion();
});

$("#btnReplace").click(function() {
    $("#theAcc")
        .accordion("destroy");
        .html("<h3><a href='#'>A</a></h3><div>AAAA</div><h3><a href='#'>B</a></h3><div>BBBB</div><h3><a href='#'>C</a></h3><div>CCCC</div>")
        .accordion();
});​

アコーディオンがバインドされているHTML要素（クリックイベントなど）を部分的に破棄したため、問題が発生します。交換を行う前にアコーディオンを分解するのが、期待される動作を得る最も簡単な方法である可能性があります。

于 2012-05-03T19:29:12.447 に答える
1

あなたは別のdivでそれに応じてラップすることができます：

<div id="wrapper">    
<div id="theAcc">
        <h3><a href="#">1</a></h3>
        <div>One</div>
        <h3><a href="#">2</a></h3>
        <div>Two</div>
        <h3><a href="#">3</a></h3>
        <div>Three</div>    
    </div>
</div>
<button id="btnReplace">Replace</button>​​​​​​

そして、これがあなたの新しいjQueryです：

$(function() {
    $( "#theAcc" ).accordion();
});

$("#btnReplace").click(function() {
    $("#wrapper").html("<div id='theAcc'><h3><a href='#'>A</a></h3><div>AAAA</div><h3><a href='#'>B</a></h3><div>BBBB</div><h3><a href='#'>C</a></h3><div>CCCC</div></div>");        $( "#theAcc" ).accordion();
});​
于 2012-05-03T19:29:27.490 に答える