Question

我很难找到哪些选择器用于在我的页面上显示一些div，因为我的html结构过于复杂（wordpress评论系统）。

我没有在这里粘贴所有内容，而是创建了一个简化版本的布局并创建了几个小提琴。

这是显示所有div的整页：

这就是我希望它的工作方式。基本上，隐藏回复框和相关的现有注释，直到单击“REPLY”，然后隐藏div为slideDown。我把这个“非工作”的JS包括在这个小提琴中。希望有人可以告诉我哪里出错了？

 (function ($) {
$('.single-f3ed-reply').hide();
$('.f3ed-reply').hide();
$('a.this-reply').click(function () {
    $('.single-f3ed-reply').hide();
    $(this).parents().next('.single-f3ed-reply').slideDown('fast');
    $(this).parents().next('.f3ed-reply').slideDown('fast');
    return false;
});

})(jQuery);

非常感谢任何帮助。

Answer 1

.parents()返回所有所选元素上方的元素。你不想要这个，你想要只包含一个包含div / wrapper。

.next()返回下一个项目（已过滤），这在parents()

的上下文中没有意义

转到最近的包装div（closest），然后再向下（find）到您想要的项目：

    $(this).closest(".stream-wrap").find('.single-f3ed-reply').slideDown('fast');
    $(this).closest(".stream-wrap").find('.f3ed-reply').slideDown('fast');

https://jsfiddle.net/yf3oagx7/1/

Answer 2

快速入侵： https://jsfiddle.net/e25zvfyg/2/

使用：

$(this).closest('article').find('.single-f3ed-reply').slideDown('fast');
$(this).closest('article').find('.f3ed-reply').slideDown('fast');

Answer 3

你可以试试这个 -

(function ($) {
$('.single-f3ed-reply').hide();
$('.f3ed-reply').hide();
$('a.this-reply').click(function () {
    $('.single-f3ed-reply').hide();
    $(this).parent().parent().parent().find('.single-f3ed-reply').slideDown('fast');
    $(this).parent().parent().parent().find('.f3ed-reply').slideDown('fast');
    return false;
});

})(jQuery);

您也可以使用jquery nearest（）函数来实现这一点。

(function ($) {
$('.single-f3ed-reply').hide();
$('.f3ed-reply').hide();
$('a.this-reply').click(function () {
    $('.single-f3ed-reply').hide();
    $(this).closest('.stream-wrap').find('.single-f3ed-reply').slideDown('fast');
    $(this).closest('.stream-wrap').find('.f3ed-reply').slideDown('fast');
    return false;
});

})(jQuery);

$ this - 找不到正确的jQuery选择器

3 个答案: