如何使用jquery只切换一个对象

我一直在使用jquery上的切换函数，但遇到了一些问题。我可以成功切换我的一个对象，但当我单击它时，所有对象的隐藏内容都会显示出来，而不仅仅是该特定对象的内容

以下是相关代码：

剧本：

$(document).ready(function(){

$("button").click(function () {
      $("p").slideToggle("slow");
    });

});

HTML：

<button>Click me.</button><br />
<p style="display: none;">Word</p><br />
<button>Click me.</button>
<p style="display: none;">Word</p><br />
<button>Click me.</button>
<p style="display: none;">Word</p><br />
<button>Click me.</button>
<p style="display: none;">Word</p>

---

我认为您可能正在寻找jquery中的方法。我还建议将两个元素包装在一个div中，这样，如果存在多个相同类型的选择器，就可以消除任何引用问题

例如：

<div>
    <button>Click me.</button>
    <p style="display: none;">Word</p><br />
</div>
<div>
    <button>Click me.</button>
    <p style="display: none;">Word</p><br />
</div>

<script>
    $(document).ready(function(){
        $("button").click(function () {
          $(this).next("p").slideToggle("slow");
        });
    });
</script>

点击我。
Word

点击我。
Word

$（文档）.ready（函数（）{
$（“按钮”）。单击（函数（）{
$（此）.next（“p”）.slideToggle（“慢”）；
});
});

如果一次只想隐藏一个p： 1） 您可以根据需要使用ID和选择器 也可以将按钮和p包装在div或span中，如：

<div>
<button>Click me</button>
<p>text</p>
</div>

点击我
正文

您的js将是：

$（“按钮”）。单击（函数（）{

$（这个）。父母（“div”）。孩子（“p”）。滑动切换（“慢”）

}))

---

尚未测试，但您得到了想法

您必须使用

id

或

class

或其他属性来确定切换按钮要影响的元素。您可能需要查看

兄弟姐妹

，而不是使用

父母

，然后再使用

子女

。

<div>
<button>Click me</button>
<p>text</p>
</div>