web-dev-qa-db-fra.com

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

J'ai cette ligne de code:

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

Je deviens "faux" au lieu d’obtenir l’un des autres éléments (en supposant qu’il en existe un - et qu’il doit exister). Je suppose que le problème est avec:

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

Quel est le problème?

Mon but est de créer mon propre accordéon (sans utiliser l'interface utilisateur de jQuery)

et j'essaye de l'écrire comme ceci:

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

javascriptjqueryhtmlaccordion
67
Alon

Utilisez plutôt la fonction not :

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

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

108
Dennis

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

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

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

88
Qar

la méthode hasClass() de jQuery renvoie un booléen (vrai/faux) et non un élément. En outre, le paramètre à lui attribuer est un nom de classe et non un sélecteur en tant que tel.

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

7
techfoobar

Vous pouvez également utiliser la méthode jQuery - is (selector) Method :

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

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

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