Comment afficher les 3 premiers éléments UL uniquement sur le document de charge?

J'ai une Liste (UL), qui a une classe de .more_stories l'UL LI contient.

J'utilise ce code pour les masquer par défaut sur la charge:

$('ul.more_stories li').css({'display': 'none'});

Maintenant je veux afficher les 3 premiers li éléments à l'intérieur de l'UL par la suite. Comment puis-je le faire en jQuery?

-Note: j'ai plusieurs ULs avec la même classe.

J'ai essayer et j'obtiens des résultats inattendus..

//more stories
$('ul.more_stories li').css({'display': 'none'});
$('ul.more_stories li:gt(2)').show();

Merci d'avance.

OriginalL'auteur Ahmad Fouad | 2010-12-02

  1. 17

    Vous voulez le :lt() sélecteur au lieu de cela, comme ceci:

    $('ul.more_stories li').hide();
$('ul.more_stories li:lt(3)').show();

    Ou, un peu plus simple/rapide à l'aide de .slice():

    $('ul.more_stories li').hide().slice(0, 2).show();

    Cette approche cache-les tous, puis à l'aide du même ensemble et de prendre le 0-2 indice d'éléments à afficher.

    Vous pouvez également inverser la démarche, de ne jamais cacher les 3 premiers, comme ceci:

    $('ul.more_stories li:gt(2)').hide();

    Ou encore en utilisant des .slice():

    $('ul.more_stories li').slice(3).hide();

    Pour les commentaires, pour faire ce travail à travers de multiples <ul> élément, utilisez un .chacun() boucle, comme ceci:

    $('ul.more_stories').each(function() {
  $(this).children().slice(3).hide(); 
});
    Grand. qui travaille pour la première UL uniquement. si j'ai plusieurs ULs avec la même classe .more_stories.. comment puis-je l'appliquer à tous les ULs ? merci encore
    J'aimerais utiliser un .each() dans ce cas (puisque :nth-child() serait salissante/répétitif), par exemple: $('ul.more_stories').each(function() { $(this).children().slice(3).hide(); });
    Merci, a réussi à faire le tri $('ul.more_stories li').css ({"display": "none"}); $("ul.more_stories").each(function(){ $(this).les enfants('li').slice(0, 2).show(); }); est-ce exact?
    tout à fait, mais il n'y a pas de raison de cacher leur montrer...juste cacher ceux que vous ne voulez pas en un seul passage, j'ai ajouté la façon de le faire ci-dessus 🙂
    Je vous remercie beaucoup. il a travaillé.

    OriginalL'auteur Nick Craver