Question

所以我遇到的问题是我有这个Div“回复”，里面是一个带有隐藏字样的h1标签。单词Hide被包含在span标签中，其类为“Toggle”我有Jquery代码，基本上每当你点击Div它就会切换span标签中的隐藏文本来显示，当然如果你再次点击它会恢复正常，我遇到的问题是我有这些类的多个实例，并且更改了其他类的文本。我想知道在jquery中是否有一种方法只能切换特定的一个点击，同时保持我所有其他类相同（因为我需要重复使用它们）。

Jquery

  $('.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>

Answer 1

是的，使用this作为context in the selector，因此它只会更改当前点击的div内的切换

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

上下文选择器的工作方式与find()

完全相同

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

FIDDLE

Jquery切换文本，选择所有实例

1 个答案: