Boucler les éléments de la liste afin de construire un tableau à transmettre dans la requête AJAX

Question

Je veux transmettre un paquet de données à mon serveur.

donc j'ai un tas de listes comme ceci:

<ul id="myList"> 
<li><span class="firstData">10</span><span id="secondData">banana</span></li> 
<li><span class="firstData">20</span><span id="secondData">grapefruit</span></li> 
<li><span class="firstData">30</span><span id="secondData">apple</span></li> 
<li><span class="firstData">40</span><span id="secondData">pear</span></li> 
<ul> 

Je veux faire une boucle dans la liste et de créer des données sous la forme 'firstDataValue_secondDataValue je peux construire une chaîne pour passer dans mon POST requête ajax.

quelque chose comme value=10_banana&value=20_grapefruit&amp et ainsi de suite.

Comment mieux puis-je faire défiler les éléments afin de créer la chaîne de données que je recherche.

Merci d'avance.

Answer 1

$('ul#myList li').each(function(){ 
//do what you want here 
    var number = $(this).find('span:first-child').text(); 
    var fruit = $(this).find('span:first-last').text(); 
//now you have both values do whatever you want with it 
}); 

qui boucle pour chaque élément li

Answer 2

Cela devrait construire la chaîne formatée la façon dont vous avez demandé basé sur HTML que vous avez fourni mais en changeant id-class comme suggéré dans les commentaires à la question: Working example

var str = ''; 
$('ul#myList li').each(function(){ 
    var spans = $(this).find('span'); 
    str += 'value='+spans[0].innerHTML+'_'+spans[1].innerHTML+'&'; 
});