Comment utiliser dans jQuery :not et hasClass() pour obtenir un élément spécifique sans classe ?

Question

J'ai cette ligne de code :

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

J'obtiens "false" au lieu d'obtenir l'un des autres éléments (en supposant qu'il y en ait un - et il doit y en avoir un). Je suppose que le problème vient de :

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

Quel est le problème ?

Mon objectif est de créer mon propre accordéon (sans utiliser jQuery UI).

et j'essaie de l'écrire comme ça :

$('#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');

});

Est-ce le meilleur moyen ? Merci, Alon

Answer 1

Utilisez le not à la place :

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

hasClass teste uniquement si un élément possède une classe, not supprimera les éléments de l'ensemble sélectionné correspondant au sélecteur fourni.

Answer 2

C'est beaucoup plus facile de faire comme ça :

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

Le ! devant le critère signifie faux, fonctionne dans la plupart des langages de programmation.

Answer 3

La méthode de jQuery hasClass() renvoie un booléen (vrai/faux) et non un élément. De même, le paramètre à lui donner est un nom de classe et non un sélecteur en tant que tel.

Par exemple : x.hasClass('error');

Answer 4

Vous pouvez également utiliser jQuery - Méthode is(selector) :

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

Answer 5

Je ne sais pas si c'était vrai au moment de la publication initiale, mais la méthode des frères et sœurs autorise les sélecteurs, donc une réduction de ce que le PO a indiqué devrait fonctionner.

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