Javascript 使用jQuery单击锚定时切换最近的内容

我的内容结构如下：

<a href="#" class="toggle_button">Click me.</a>
<p class="hidden_content">This content is toggleable.</p>

<a href="#" class="toggle_button">Click me.</a>
<p class="hidden_content">This is a different section.</p>

<a href="#" class="toggle_button">Click me.</a>
<p class="hidden_content">This section is also different.</p>

此内容可切换
这是一个不同的部分
此部分也不同

我已经发现了如何使用一个部分来实现这一点，但是如何才能使它在单击切换按钮时只打开最近的隐藏内容类。

使用

使用

试试看

$("a").click( function(){
   $(this).next('p').toggle();   
});

试试看

$("a").click( function(){
   $(this).next('p').toggle();   
});

---

使用JavaScript很容易，但您也可以使用以下简单的CSS--

此内容可切换
.隐藏内容{
显示：无；
}
.隐藏内容：目标{
显示：块；
}

---

使用JavaScript很容易，但您也可以使用以下简单的CSS--

此内容可切换
.隐藏内容{
显示：无；
}
.隐藏内容：目标{
显示：块；
}

---

这将切换以下div，并停止页面返回顶部：

$('a.toggle_button').click(function(e) {
    e.preventDefault();
    $(this).next('p.hidden_content').toggle();
}

---

这将切换以下div，并停止页面返回顶部：

$('a.toggle_button').click(function(e) {
    e.preventDefault();
    $(this).next('p.hidden_content').toggle();
}

$('a.toggle_button').click(function(e) {
    e.preventDefault();
    $(this).next('p.hidden_content').toggle();
}