2

したがって、私が抱えている問題は、この Div "Reply" があり、その中に Hide という単語が含まれる h1 タグがあることです。非表示という単語は、「トグル」のクラスのスパンタグでラップされています。基本的に、Divをクリックするたびに、スパンタグの非表示テキストを切り替えて表示するというJqueryコードがあります。もちろん、もう一度クリックすると表示されます私が抱えている問題は、これらのクラスのインスタンスが複数あり、他のクラスのテキストが変更されていることです。他のすべてのクラスを同じに保ちながら、クリックしている特定のクラスのみを切り替える方法が jquery にあるのだろうか (それらを何度も再利用する必要があるため)。

Jクエリ 

  $('.Reply').toggle (
    function()  { $("span.Toggle").html("Show");}
    ,function()  { $("span.Toggle").html("Hide");}
   );

HTML

<div class="Reply">
  <h1><span class="Toggle">Hide</span> This Text</h1>
</div>

<div class="Reply">
  <h1><span class="Toggle">Hide</span> This Text</h1>
</div>
4

1 に答える 1

2

はい、セレクターのコンテキストthisとして使用して、現在クリックされている div 内のトグルのみを変更します

$('.Reply').toggle( function () {
  $("span.Toggle", this).html("Show");
}, function () {
  $("span.Toggle", this).html("Hide");
});

コンテキストセレクターはfind()とまったく同じように機能します

$(this).find("span.Toggle")

フィドル

于 2013-01-07T21:13:37.040 に答える