Obtenir le dernier élément dans un $ ('div'). Each()

Question

J'utilise jquery et la fonction each mais j'ai du mal à trouver le dernier élément dans une liste ul.

DONNÉES:

<ul id="1"> 
    <li>1</li> 
    <li>2</li> 
    <li>3</li> 
</ul> 
<ul id="2"> 
    <li>1</li> 
    <li>2</li> 
    <li>3</li> 
</ul> 
<ul id="3"> 
    <li>1</li> 
    <li>2</li> 
    <li>3</li> 
</ul> 

J'ai essayé plusieurs choses, mais rien fait ce que je veux. Voici j'ai essayé.

var test = '{'; 
for (i = 1; i <= 3; i++) { 
    test += i+':{'; 
    $('#'+i+' li').each(function(index,e){ 
      test += $(this).attr('id'); 

      // THIS IS THE PROBLEM AREA START 
      if(index != $('#'+i).last()){ 
       test += ','; 
      } 
      // PROBLEM AREA END 

    }); 
    test += '}'; 
    if(i != 3){ 
      test += ','; 
    } 
} 
test += '}'; 
alert(test); 

J'ai aussi essayé d'utiliser le "$ ('#' + i + ': dernier')", mais cela ne l'a pas fait l'éther.

La sortie que je suis en train de faire est:

{1:{1,2,3},2:{1,2,3},3:{1,2,3}} 

Answer 1

je recommande de créer un tableau avec vos chaînes, puis les joindre à une virgule.

donc quelque chose comme ceci:

var arr = ["1:{1,2,3}", "2:{1,2,3}", "3:{1,2,3}"]; 

var str = "{" + myArray.join(",") + "}"; 

Ainsi, à chaque itération de la boucle each vous feriez construire une chaîne comme "1:{1,2,3}" et push à votre tableau.

Answer 2

Vous essayez de sélectionner le dernier élément de l'ensemble correspondant (qui se compose uniquement de votre ul plutôt que ses enfants (qui sont li éléments)). Vous devez le faire sur les enfants de la sélection actuelle:

$('#'+i).children('li').last() 

ou (comme sélecteur):

$('#'+i+' > li:last') 

Answer 3

2 Changements

1. Utilisez

   essai + = $ (this) .text();

   au lieu de

   test + = $ (this) .attr ('id');

2. changement si la condition de

if ($ (this) .next(). Length) {

code modifié

var test = '{'; 
for (i = 1; i <= 3; i++) { 
    test += i+':{'; 
    $('#'+i+' li').each(function(index,e){ 
      // Change #1 
      test += $(this).text(); 

      // Change #2 
      if($(this).next().length){ 
       test += ','; 
      } 
    }); 
    test += '}'; 
    if(i != 3){ 
      test += ','; 
    } 
} 
test += '}'; 
alert(test); 

Answer 4

jQuery utilise en fait la propriété .length (http://api.jquery.com/length/) de chaque objet. Ainsi, lorsque vous utilisez un sélecteur, et que vous avez une liste d'éléments correspondants, .length - 1 sera l'index du dernier élément. i.e. .:

var test = '{'; 
for (i = 1; i <= 3; i++) { 
    test += i+':{'; 
    $('#'+i+' li').each(function(index,e){ 
      test += $(this).attr('id'); //This is erroneous; this (ie e)'s 
             //id is nonexistent. Do you mean .html()? 

      // THIS IS THE PROBLEM AREA START 
      if(index != $('#'+i+' li').length - 1){ 
       test += ','; 
      } 
      // PROBLEM AREA END 

    }); 
    test += '}'; 
    if(i != 3){ 
      test += ','; 
    } 
} 
test += '}'; 
alert(test); 

Bien qu'il y ait plus de quelques problèmes ici. Si vous avez ajouté le class='include' à chaque <ul> ...

var str; 
$('.include').each(function (index, e) { 
    str += e.attr('id') + ": {"; 
    e.children().each(function (cIndex, child) { 
     str += child.html() + (cIndex != e.children().length - 1) ? ', ' : ''; 
    }); 
    str += '}' + (index != e.parent().children().length - 1); 
}); 

Peut fournir des informations utiles. Fondamentalement ce que vous essayez d'écrire est un sérialiseur JSON. Vous voudrez peut-être vérifier http://flexjson.sourceforge.net/

Answer 5

Tout d'abord, votre sortie ressemble à du code JSON. Puisque vous utilisez déjà jQuery, il existe des moyens beaucoup plus simples de générer du code JSON que de créer la chaîne à partir de zéro. Deuxièmement, une suggestion: Si vous utilisez un nom de classe pour vos tags <ul>, vous n'aurez pas besoin de déranger avec une boucle for() pour ces ID numériques (avez-vous vraiment besoin d'ID numériques? Ils vous mordront finalement!). - Gardez à l'esprit que les ID doivent être uniques sur la page et JSON s'attend à ce que les tableaux contenant des index numériques soient indiqués par des crochets plutôt que par les accolades que vous utilisez.

<ul class='mylist'> 
    <li>1</li> 
    ... 

Ensuite, vous pouvez écrire du code comme ceci:

myarray=[]; 
$('.mylist').each(function(ulindex) { 
    myarray[ulindex]=[]; 
    $(this).children().each(function(liindex) { 
    myarray[ulindex][liindex]=$(this).text(); 
    }) 
}); 
$output=$.toJSON(myarray); 

code ci-dessus n'a pas été testé, mais devrait être assez proche pour vous donner une idée. (note: vous pouvez avoir besoin d'un plugin jquery pour obtenir la méthode toJSON(), je ne m'en souviens pas)

Answer 6

Après avoir relu votre question, ce que vous voulez vraiment, c'est une manière intelligente de faire la sortie, sans détecter ce que est le dernier élément.

Vous devriez faire quelque chose comme:

var rootArr = new Array(); 

for (i = 1; i <= 3; i++) { 
    var liArr = new Array(); 
    $("#" + i + " li").each(function() { 
     // add code to 
     liArr.push($(this).text()); 
    } 
    rootArr.push(i + ":{" + liArr.join(",") + "}"); 
} 

var result = "{" + rootArr.join(",") + "}"; 

(Basé sur l'avis de SkillDrick)

Answer 7

L'un des problèmes est que vous essayez d'utiliser les numéros pour les noms de membres dans les objets. Je vais éléminer ceci en les préfixant dans l'objet de base avec "id-", et en utilisant des tableaux dans l'objet.

var out = {};  
    $("ul").each(function() { 
     var ul = []; 
     $(this).find("li").each(function() { 
      ul.push($(this).text()); // maybe .html() ? 
     }); 
     out."id-" + $(this).attr("id") = ul; 
    }); 
    console.log(JSON.parse(out)); 

Je n'ai pas testé cela, mais vous avez l'idée. Trier à travers chaque UL, et trier chaque LI de chaque UL.

sortie doit:

{"id-1": [1,2,3], "id-2":, [1,2,3], "id-3":[1,2,3]}