javascript - 选择当前元素之后的下一个 DOM 元素

Question

我需要在点击事件后显示一个 div。

HTML

<a href="#" class="more-items-link">more items</a><div class="more-items"></div>
<a href="#" class="more-items-link">more items</a><div class="more-items"></div>
etc.

Javascript：

$('.more-items').hide();

$('.more-items-link').click(function()
{
    var currentDiv = $(this).parent().next();
    currentDiv.show();
});

如何在有点击事件的地方显示当前链接的 div？我尝试了很多东西，但仍然无法正常工作。

Answer 1

在这种情况下，您不需要回到父级，您只需要下一个兄弟，这样您就可以调用.next()链接本身：

$('.more-items-link').click(function()
{
    var currentDiv = $(this).next(".more-items");
    currentDiv.show();
});

这是上面代码的jsFiddle

Answer 2

试试这个：

$('.more-items-link').click(function()
{
    var currentDiv = $(this).next();
    currentDiv.show();
});

此处无需使用该.parent()方法，因为 div 就在锚点旁边。