2013-06-27 4 views
18

ich eine lange dynamisch generierte Liste mit jeweils der gleichen Klasse Kennung habe und ein Datenattribut ähnlich den folgenden Code:JQuery alle Daten erhalten Attribute aus einer Liste

<ul> 
    <li class="list" data-id="123">One</li> 
    <li class="list" data-id="124">Two</li> 
    <li class="list" data-id="125">Three</li> 
    <li class="list" data-id="126">Four</li> 
    .....etc 
</ul> 

, was ich versuche zu erreichen, ist zu erhalten alle data-id Werte und formatieren sie in wie folgt:

123|124|125|126....etc 

diese dann auf eine Seite über ajax und die IDs überprüft in einer Datenbank zur Existenz weitergegeben würden.

var delimited_data=""; 
$('.list').each(function(){ 
    delimited_data+=$(this).data('id')+"|"; 
}); 
console.log(delimited_data); 

Der Grund, warum ich diese Frage bin zu fragen ist, dass ich auf einem Live-System arbeite, die automatisch Elemente in der Liste Spalten an verschiedene Benutzer nach 10 Minuten einsetzt. Ich muss nur sicher sein, dass der Code den richtigen Weg geht :)

Ich muss auch überprüfen, dass es keine .list Klassen auf der Seite gibt (dh - keine Möglichkeit, die Abfrage zu tun), ob delimited_data wird vollständig sein leer, was ich ziemlich sicher bin.

Gibt es einen besseren Weg als .each() in diesem Fall zu verwenden, da ich finde, dass es ziemlich langsam sein kann, dass die obige Funktion alle 30 Sekunden ausgeführt wird.

+1

Um das Vorhandensein von '.list' zu überprüfen, führen Sie einen Check auf die Länge von' .list' –

Antwort

46

Sie können .map ein Array zurück:

var dataList = $(".list").map(function() { 
    return $(this).data("id"); 
}).get(); 

console.log(dataList.join("|")); 

Demo: http://jsfiddle.net/RPpXu/

+0

Dies scheint eine ziemlich gute Möglichkeit dies zu tun - nicht verwendet .map() vor) – Sideshow

+0

Liebe die '.map' Funktion , hilft oft aus! – tymeJV

+0

das ist def die beste antwort für mich. Prost. –

5

Mit dieser:

var array = []; 

$('li.list').each(function() { 
    array.push($(this).data('id')); 
}) 

var joined = array.join('|'); 
1

keine Antwort auf Ihre Frage, aber das ist, was ich am Ende auf dieser Seite auf der Suche nach und obwohl es jemand anderem helfen würde :-)

var arrayOfObj = $('input').map(function() { 

    return { 
      name : $(this).attr('name'), 
      data : $(this).data('options'), 
      value : $(this).val(), 
      id : $(this).attr('id') 
     } 

}).get(); 
console.log(arrayOfObj) 

Dies gibt ein Array von Objekten zurück, die die Eingabe nachahmen
Prost!