jquery - 1ページに複数のjqueryトグル

Question

こんにちは、divを使用して、単一のページで動作するjqueryトグルの複数のインスタンスを取得しようとしています。現在のフィドルはこちら: http://jsfiddle.net/sketch360/kX34v/ で、単純な javascript を使用しています:

$(".toggle-title").click(function () {
    $(".toggle-details").toggle("fast");
});

残念ながら現時点では、見出しのいずれかを切り替えるとすべての結果が表示されます。明らかにそれらはすべて同じクラスを持っていますが、他の子もアクティブ化せずに、親に属する子 div をアクティブ化する方法を見つけることができません.

私は、html をあまり変更せずにこれを行う方法を見つけようとしています。つまり、子ごとに異なるクラスを用意しています。

私はすでにジェフの答えを見てきました. 上記の私のフィドルは機能していますが、私が求めている独立したトグルアクションはありません。

score 2 · Accepted Answer

そのようにしてはいけません。そのようにすべてを切り替えます。したがって、コードを次のように変更します。

$(".toggle-title").click(function () {
    $(this).next(".toggle-details").toggle("fast");
});

score 0 · Accepted Answer

jquery 1.2以降のバージョンを使用している場合は、次の1つも機能します

$(".toggle-title").click(function () {        
     $(this).nextAll(".toggle-details").first().toggle("fast");
});

2 に答える 2