Verwendung in jQuery: not und hasClass (), um ein bestimmtes Element ohne Klasse abzurufen

71

Ich habe diese Codezeile:

$('#sitesAccordion .groupOfSites').click(function() {
    var lastOpenSite = $(this).siblings().hasClass(':not(.closedTab)');
    console.log(lastOpenSite);
});

Ich bekomme "falsch", anstatt eines der anderen Elemente zu bekommen (vorausgesetzt, es gibt eines - und es muss eines geben). Ich denke, das Problem liegt bei:

.hasClass(':not(.closedTab)');

Worin besteht das Problem?

Mein Ziel ist es, mein eigenes Akkordeon zu erstellen (ohne die jQuery-Benutzeroberfläche zu verwenden).

und ich versuche es so zu schreiben:

$('#sitesAccordion .groupOfSites').click(function() {

    //Get the last opened tab
    var lastOpenSite = $(this).siblings().hasClass(':not(.closedTab)');

    //Close last opened tab and add class
    lastOpenSite.hide().toggleClass('closedTab');

    //Open the current Tab
    $(this).children('.accordionContent').toggle('fast');

    // remove class from open tab
    $(this).toggleClass('closedTab');


});

Ist das der beste Weg? Danke, Alon

Alon
quelle

Antworten:

120

Verwenden Sie notstattdessen die Funktion:

var lastOpenSite = $(this).siblings().not('.closedTab');

hasClasstestet nur, ob ein Element eine Klasse hat, notentfernt Elemente aus dem ausgewählten Satz, die dem bereitgestellten Selektor entsprechen.

Dennis
quelle
ohh - das war ein dummer Fehler, den ich gemacht habe - danke für die Antwort!
Alon
100

So geht das viel einfacher:

if(!$('#foo').hasClass('bar')) { 
  ...
}

Das ! vor den Kriterien bedeutet falsch, funktioniert in den meisten Programmiersprachen.

Qar
quelle
Dies funktioniert nicht für das, was das OP versucht. Es wird nur getestet, ob #fooeine Klasse vorhanden ist oder nicht, und es wird die übereinstimmende Menge von Elementen nicht auf diejenigen reduziert, die sie haben.
James Allardice
5
Dieser Weg funktioniert ziemlich gut in meiner völlig anderen Situation. Vielen Dank.
Rich Finelli
Alles was ich falsch gemacht habe war Putten! mit Zahnspangen !($(this).hasClass()), die nicht funktionierten.
Galzor
7

jQuery's hasClass() Methode von gibt einen Booleschen Wert (true / false) und kein Element zurück. Außerdem ist der Parameter, der ihm gegeben werden soll, ein Klassenname und kein Selektor als solcher.

Zum Beispiel: x.hasClass('error');

Techfoobar
quelle
2

Ich weiß nicht, ob dies zum Zeitpunkt der ursprünglichen Veröffentlichung der Fall war, aber die Geschwistermethode ermöglicht Selektoren, sodass eine Reduzierung der aufgelisteten OP funktionieren sollte.

 $(this).siblings(':not(.closedTab)');
devRyan
quelle