Question

有人可以解释一下为什么要替换以下

$('.post_title a').hover(function () {
    $(this).parent().parent().parent().parent().find(".post_footer").toggleClass('footer_border')
});

与

$('.post_title a').hover(function () {
    $(this).closest(".post_footer").toggleClass('footer_border')
});

不起作用？

Answer 1

看看the documentation for .closest()。它声明：

给定一个表示一组DOM元素的jQuery对象， .closest()方法搜索这些元素及其祖先在DOM树中，从匹配中构造一个新的jQuery对象元素。 .parents()和。closest()方法类似他们都遍历DOM树。

由于您要查找的元素不是链接的祖先，因此无法使用。为了达到你的需要，你可以改用它：

$(this).parents().next('.post_footer').eq(0).toggleClass('footer_border');

Answer 2

closest()用于查找元素的最近直接父级。

在第一个示例中，使用find()在当前元素的父元素内定位元素。这就是closest()失败的原因 - .post_footer不是当前元素的直接父级。

如果您可以发布代码的HTML结构，我可以为您提供有关如何解决此问题的更多详细信息。

Answer 3

尝试这样做......

$('.post_title a').hover(function () {
    $(this).closest(PARENT_OF_POST_FOOTER_SELECTOR)
        .find(".post_footer").toggleClass('footer_border')
});

这假定您已定义PARENT_OF_POST_FOOTER_SELECTOR。

jQuery Closest（）不起作用

3 个答案: