Question

可能重复：
Use same div to toggle different parts of the page

您好我有以下代码：

的Javascript / jQuery的：

 $(document).ready(function() {
  $(this).find("a").click(function() {
   $(this).find("div").toggle();
  });
});

使用for循环打印的Html代码：

<div>
<a class="clickMe">Toggle my text</a>
<br />
<div class="textBox"> - This text will be toggled</div>
</div>

<div>
  <a class="clickMe">Toggle my text</a>
  <br />
  <div class="textBox"> - This text will be toggled 2</div>
</div>

<div>
  <a class="clickMe">Toggle my text</a>
  <br />
  <div class="textBox"> - This text will be toggled 3</div>
</div>

我希望能够：

当页面加载时，我想要隐藏并在点击时切换。
使用<a class="clickMe">和<div class="textBox">的相同类来切换或隐藏正确/等效的<div>元素。

jsFiddle代码：

http://jsfiddle.net/A7Sm4/8/

由于

Answer 1

This updated jsFiddle会奏效。基本上将第一个查找更改为常规选择器，然后转到锚点的父级以查找子级别，并切换它们。

完成此任务的众多方法之一。

Answer 2

:) http://jsfiddle.net/A7Sm4/17/

Answer 3

请参阅演示：Fiddle

Jquery代码：

  $(document).ready(function() {
     $("a").click(function() {
       $(this).parent().find("div").slideToggle();
     });
   });

CSS：

.textBox {
    display:none;
}

HTML：

<div>
    <a class="clickMe">Toggle my text</a>
    <br />
    <div class="textBox"> - This text will be toggled</div>
</div>

<div>
    <a class="clickMe">Toggle my text</a>
    <br />
    <div class="textBox"> - This text will be toggled 2</div>
</div>

<div>
     <a class="clickMe">Toggle my text</a>
     <br />
     <div class="textBox"> - This text will be toggled 3</div>
 </div>

$（this）和toggle（）多个类的问题

3 个答案: