0

これは複数の場所にあるので、固有のデータで機能させたいと思います。

の代わりに、の<a class="snippet_show_answers" href="#">Se svar</a>ようなもの<a DATA="1" class="snippet_show_answers" href="#">Se svar</a>をスクリプトの一部として実行する必要があります。これにより、クリックされたデータのみが処理され、すべてのボックスは処理されません。

私のHTMLはこれです(それらの複数で):

<p class="snippet_answers">Svar: 3 - <span class="green"><a class="snippet_show_answers" href="#">Se svar<img src="images/answerarrow.png" alt="answerarrow" height="14" width="13"></a><a class="snippet_hide_answers" href="#" style="display: none;">Skjul svar<img src="images/answerarrow.png" alt="answerarrow" height="14" width="13"></a></span><hr />
    <div class="answers" style="display: none;">
        <p>blablabla</p>
    </div>
</p>

私のJSはこれです:

$('.snippet_show_answers').live("click", function() {
    $('.answers').slideDown("slow");
    $('.snippet_show_answers').fadeOut("slow");
    $('.snippet_hide_answers').fadeIn("slow");
    return false;
});

$('.snippet_hide_answers').live("click", function() {
    $('.answers').slideUp("slow");
    $('.snippet_hide_answers').fadeOut("slow");
    $('.snippet_show_answers').fadeIn("slow");
    return false;
});

誰かが私を理解してくれることを願っています。私は以前にこの方法を見たことがありますが、名前などはわかりません。

よろしくお願いします。

4

1 に答える 1

2

クリックしたアイテムの親要素への参照を取得し、適切なクラスでその子孫を見つけます。

$('.snippet_show_answers').live("click", function() {
    var item = $(this).closest(".snippet_answers");
    item.find('.answers').slideDown("slow");
    item.find('.snippet_show_answers').fadeOut("slow");
    item.find('.snippet_hide_answers').fadeIn("slow");
    return false;
});

$('.snippet_hide_answers').live("click", function() {
    var item = $(this).closest(".snippet_answers");
    item.find('.answers').slideUp("slow");
    item.find('.snippet_hide_answers').fadeOut("slow");
    item.find('.snippet_show_answers').fadeIn("slow");
    return false;
});

また、最新バージョンのjQueryを使用している場合は、必ずに変更.live()して.on()ください。 .live()最近廃止されました。

于 2013-01-05T01:13:06.503 に答える