jQuery - 不确定使用哪种方法,nearest()和parent()不起作用

Question

上帝我觉得我是垃圾邮件堆栈溢出,这是我今天的第3篇帖子.对不起,嘿.

我之前甚至发过一个关于这个的问题,但是我已经改变了一些代码,所以我认为发布一个新问题会更好.

$('.pmlist ul li h4 .toggle').click(function() {
    $(this).closest('.meddel').toggle(250);
});

这就是我现在所拥有的.nearest()方法不起作用的原因是因为div .meddel紧挨着h4元素.而nearest()只在DOM树上爬行,忽略其他子元素.对？parent()的工作方式几乎相同,也不起作用.

因为我只想切换元素中最接近的.meddel div,我需要一些东西,是的,只是抓住最近的那个,而不是全部.

为了清除它,这里是一个列表项的HTML:

<li class="item">

<h4><a class="toggle">[topic]</a><small>2010-04-17 kl 12:54 by <u>[name]</u></small></h4>

<div class="meddel">
    <span>
        <img style="max-width: 70%; min-height: 70%;" src="profile-images/img.jpg" alt="" />
        <a href="account.php?usr=47">[name]</a>
    </span>

    <p>text</p>
</div>

</li>

我有几个这样的项目,如果我点击一个切换链接,我只想切换最近的.meddel,如前所述.

谢谢.

Answer 1

你可以使用:

$(this).parent().next().toggle(250);

更新(根据tvanfosson评论):

$(this).parents(".item").find(".meddel").toggle(250);

这是一种更灵活,更安全的解决方案.首先,它获取条目容器(.item),然后找到条目的主体并切换它.它对DOM中的功能更改不太敏感.

Answer 2

这是解决这个问题的另一种方法:

$('.pmlist ul li h4 .toggle').click(function() { 
  $(this).closest('h4').siblings('.meddel').toggle(250); 
});

这取决于<h4>,然后查找.meddel要切换的兄弟元素. 你可以在.siblings()这里阅读更多内容.这种方法使其对标记更改更具弹性,但如果脚本无论如何都是紧密耦合的,那么这可能不是什么大问题.