2010-04-23 4 views
1

Je liste htmlpas en mesure d'obtenir une liste traitée dans la variable jquery

<ol id="newlist"> 
     <li>Test 
      <ol> 
       <li>1</li> 
       <li>2</li> 
       <li>3</li> 
      </ol> 
     </li> 
     <li>Another test 
      <ol> 
       <li>1</li> 
      </ol> 
     </li> 
     <li>Cool Test 
      <ol> 
       <li>1</li> 
       <li>2</li> 
      </ol> 
     </li> 
    </ol> 

Maintenant, je l'ai caché la liste en utilisant le css ...

 #newlist li { 
      display:none; 
      list-style: none; 
     } 

Je veux afficher la liste et les seuls descendants qui ont plus de 1 descendants ...

la sortie devrait être ...

Test 
    1 
    2 
    3 
Another test 
Cool Test 
    1 
    2 

Je l'ai utilisé jquery et en mesure d'obtenir la sortie ...

le code utilisé i ...

$("ol#newlist > li").show(); 


      for (var i = 0; i < $("ol#newlist > li").length; i++) 
      { 
       if ($("ol#newlist > li:eq(" + i + ") ol > li").length > 1) 

       $("ol#newlist > li:eq(" + i + ") ol > li").show(); 


      } 

la page exemple here

Maintenant, je veux toute la liste dans un seule variable comme je peux obtenir le lis dans une variable ...

 var $li = $("ol#newlist > li"); 

mais le code

 $li.add($("ol#newlist > li:eq(" + i + ") ol > li")); 

ne fonctionne pas ...

la page échantillon here

la page échantillon a été mis à jour ... la réponse devrait être ....

 var $li = $("ol#newlist > li").add(
        $('#newlist').children('li').children('ol').filter(function() { 
         return $(this).children().length > 1; 
        }).children() 
      ); 
    $li.show(); 

ou

var $li = $('#newlist').find('li').filter(function() { 
       return ($(this).siblings('li').length); 
      }); 
    $li.show(); 

comme répondu par patri k ...

Merci pour l'aide ...

Merci
Pradyut
Inde

Répondre

1

Désolé si ce n'est pas ce que vous cherchez, mais le résultat que vous voulez a la li toujours montrer, avec son enfant ol étant caché,

Test 
    1 
    2 
    3 
Another test 
Cool Test 
    1 
    2 

Mais votre cache le css li éléments pour une raison quelconque.

#newlist li { 
     display:none; 
     list-style: none; 
    } 

Si vous cachiez place les éléments ol

#newlist ol { 
    display:none; 
} 

Vous pouvez simplement faire un filtre, et les montrer au besoin. Sinon, si vous ne pouvez pas changer votre CSS, vous devez faire un peu plus de travail en vous assurant que tout est correctement affiché.

Quelque chose comme:

$('#newlist').show().children('li').show().children('ol').filter(function() { 
     return $(this).children().length > 1; 
    }).children().show(); 

EDIT:

Il y a probablement plusieurs façons d'ajouter ce que vous voulez une collection.

En voici une. Il saisit tous les éléments li, puis les filtre afin de ne garder que ceux qui ont au moins un frère ou une sœur.

Le filtre est également appliqué aux éléments de niveau supérieur li, mais cela ne pose pas de problème car il y en a plus d'un (ils ont des frères et sœurs).

var $collection = $('#newlist').find('li').filter(function() { 
    return ($(this).siblings('li').length); 
}); 

$collection.show(); 

Depuis filter() renvoie le résultat d'un test booléen, faisant

return ($(this).siblings('li').length); 

renvoie true si la longueur est supérieure à 0.

Il y a, (je suis sûr) beaucoup d'autres façons, mais celui-ci semble assez concis. Semble un peu mieux que ma réponse originale aussi.

+0

Le dernier code fonctionne bien ... merci ... mais puis-je le retourner dans une variable ($ li) et ensuite montrer en utilisant $ li.show() ... merci ... –

+0

merci pour l'aide. .. ce code était correct ... –

+0

ok donc frères et soeurs est un index basé sur zéro alors ... pas vrai? –

0

J'ai utilisé le .each pour exécuter la fonction de chaque ol
Je pense que c'est ce que vous êtes en essayant de faire
espérons que cela aide!

$("#newlist").show(); 
    var $li = new Array(); 
    $("#newlist > li").each(function(index){ 
     if($("> ol > li", $(this)).length > 1){ 
      $("> ol", $(this)).show(); 
      $("> ol > li", $(this)).each(function(){ 
       $li.push($(this)); 
      }); 
     } else { 
      $("> ol", $(this)).hide(); 
     } 
    }); 

$($li).each(function(){ 
    alert($(this).text()); 
}); 
Questions connexes