jQuery selector by classname minus classname
I have the following jquery line in a click event of a p element:
$(this).nextUntil('.Maintheme not:.Document')
I would like to get all the next elements with class .Maintheme but not .Document.
To explain myself a little better, this is the html that i have:
<div id="DocumentContents">
<p class="Maintheme">ParentTheme1</p>
<p class="Document">Document开发者_如何学运维1</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>
Having this html content i would like that when you click in a p element if there is not subthemes then show documents. Else if there are subthemes with documents below, just show the subthemes, and if you click in a subtheme show the next documents.
Something like this?
Example: 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();
});
You should use .nextAll()
.
var $themes = $(this).nextAll('.Maintheme');
You have to do some if-statements from there to create the logic you want.
if($themes.length){
}
else{
}
Anyways, this looks odd to me. You should use a nested list for instance to display such kind of structures.
Ref.: .nextAll()
You don't have the not
syntax quite correct but it's not clear to me exactly what you are asking for so I won't try and correct it for you, just point you at the reference. I agree that this looks a bit off anyway.
I think that the not() jQuery selector is more suitable for your case since the nextUntil() selector will stop gathering the elements with the Maintheme class on the first occurence of p tag styled with Document class. Hence you can use code slice like this:
$(this).not(':.Maintheme').css(hidePtagsWithDocumentclass);
精彩评论