拨动一个DIV与同等级(Toggle one div with same class)

如何使用切换时的几个DIV与jQuery的同一类？ 我想说明的只是点击一个DIV。

JavaScript的

$(".help_content").hide();
$(".help_target").click(function()
{
    $('.help_content').toggle(); // I also tried with $(".help_content").show();
});

HTML

<div id="foo">
    <p class="help_target">
            <a href="#">Click</a>
    </p>
</div>
<p class="help_content">Asia</p>

<div id="some">
    <p class="help_target">
        <a href="#">Click</a>
    </p>
</div>
<p class="help_content">Africa</p>

我不能使用的next（）因为.help_content不是.help_target的后裔。 （我想在字段集使用.help_target并显示出.help_content字段集的）。

Answer 1:

你可以这样做：

$(".help_content").hide();
$(".help_target").click(function()
{
    $(this).parent().next('.help_content').toggle();
});

看到它在行动： http://jsfiddle.net/mattball/X7p28/

Answer 2:

采用：

$(this).closest("div").next(".help_content").toggle();

Answer 3:

$(".help_target").click(function()
{
    $(this).parent().next().toggle(); // I also try with $(".help_content").show();
});

Answer 4:

您可以通过调用实现这个.parent()然后.next()

$(".help_target").click(function()
{
    $(this).parent().next('.help_content').toggle();
});

在代码示例的jsfiddle 。

Answer 5:

为何不给DIV一个唯一的ID，然后调用切换功能

$("#help_content_DIV_ID").toggle();

Answer 6:

$('.help_target>a').click(function() {
   $('.help_content').hide();
   $(this).closest('.help_target').parent().next('.help_content').eq(0).show();
   return false;
});

文章来源: Toggle one div with same class