Question

我在 p 元素的点击事件中有以下jquery行：

$(this).nextUntil('.Maintheme not:.Document')

我想用类.Maintheme获取所有下一个元素，但不是.Document。

为了更好地解释自己，这是我的HTML：

<div id="DocumentContents">

<p class="Maintheme">ParentTheme1</p>
<p class="Document">Document1</p>
<p class="Maintheme">ParentTheme2</p>
<p class="Subtheme">SubTheme1</p>
<p class="Document">Document1</p>
<p class="Document">Document2</p>
<p class="Document">Document3</p>
<p class="Subtheme">SubTheme2</p>
<p class="Document">Document1</p>
</div>

如果没有子主题，那么当你点击p元素然后显示文档时，我希望有这个html内容。否则，如果下面有文档的子主题，则只显示子主题，如果单击子主题，则显示下一个文档。

Answer 1

您应该使用.nextAll()。

var $themes = $(this).nextAll('.Maintheme');

你必须从那里做一些if语句来创建你想要的逻辑。

if($themes.length){
}
else{
}

无论如何，这对我来说很奇怪。例如，您应该使用嵌套列表来显示这种结构。

参考：.nextAll()

Answer 2

你没有not语法非常正确，但我不清楚你究竟要求的是什么，所以我不会试着为你纠正它，只需指向你{{3} }。我同意这看起来有点不对。

Answer 3

我认为not() jQuery选择器更适合您的情况，因为nextUntil()选择器将在第一次出现使用Document类设置的p标签时停止使用Maintheme类收集元素。因此，您可以使用这样的代码片：

$（本）。不。（ '：Maintheme'）的CSS（hidePtagsWithDocumentclass）;

Answer 4

这样的东西？

示例： http://jsfiddle.net/ZSCs3/

$('p:not(.Maintheme)').hide();

$('.Maintheme').click(function() {
    var $this = $(this)
    if ($this.next('.Subtheme').length) {
        $this.nextUntil('.Maintheme').filter('.Subtheme').toggle();
    } else {
        $this.nextUntil('.Subtheme,.Maintheme').toggle();
    }
});

$('.Subtheme').click(function() {
    $(this).nextUntil('.Subtheme,.Maintheme').toggle();
});

jQuery选择器按类名减去classname

4 个答案: