javascript - 从给定的行中选择所有属性值（jQuery）

Question

我有以下结构：

<ul id="myTags"">
   <li>
     <span class="tagit-label">AA</span>
     <a>
        <span class="text-icon">×</span>
        <span class="ui-icon ui-icon-close"></span>
     </a>
     <input type="hidden" name="tags" value="AA" style="display:none;">
   </li>
   <li>
     <span class="tagit-label">BB</span>
     <a class="tagit-close">
        <span class="text-icon">×</span>
        <span class="ui-icon ui-icon-close"></span>
     </a>
     <input type="hidden" name="tags" value="BB" style="display:none;">
   </li>
   ....
</ul>

我想编写一个 Javascript/jQuery 函数，该函数将创建一个包含以下内容的字符串

"AA,BB,..."

如何从跨行的所有 value 属性中收集值？

Answer 1

这应该有效：

$('#myTags input[name="tags"]').map(function () {
    return $(this).val();
}).get().join(",");

Answer 2

尝试这个

var textArr = [];
$(".tagit-label").each(function(){
  textArr.push($(this).text());
})
console.log(textArr.join());

Answer 3

使用.map()

var array = $('.tagit-label').map(function(){
    return $(this).text()
}).get()

console.log(array.join(','))

演示：小提琴

Answer 4

你可以这样做：

var arr = $('#myTags .tagit-label').map(function () {
    return $(this).text();
}).get().join(",");

console.log(arr);

Answer 5

这是我迟到的答案。为了好玩，我尝试了 javascript 1.8 数组reduce方法。

var string = [].reduce.apply( $('.tagit-label') , [ function( ar , n ){          
     return ar.push( $(n).text() ) && ar ;
},[] ] ).join();

或者干脆

var string = [].reduce.call( $('.tagit-label') , function( ar , n ){          
     return ar.push( n.innerHTML ) && ar ;
},[] ).join();

希望这将有助于更多地了解reduce方法。http://jsfiddle.net/6TnMT/

Answer 6

小提琴示例

var str= $('.tagit-label').first().text();
    $('.tagit-label:not(":first")').each(function(){
        str= str +' , '+ $(this).text();
    });
    alert(str);

Answer 7

 var spans = $(".tagit-label");
    var str = "";
    for (i = 0; i < spans.length; i++) {

        str += spans[i].innerHTML+"," ;
    }
    alert(str);