Question

我有一个名为＆＃39; tag-label＆＃39;的跨度值列表。我希望添加每个跨度的值，并将它们插入以逗号分隔的输入字段。

我已经设置了一个JSFiddle来显示它。 http://jsfiddle.net/stefanselby/7wrg611k/

我的HTML：

<label for="TagsHolder">Keywords</label>
<ul>
   <li><span class="tag-label">test 1</span></li>
   <li><span class="tag-label">test 2</span></li>
   <li><span class="tag-label">test 3</span></li>
</ul>
<input type="text" id="TagsHolder" name="TagsHolder" value="" />
<button id="btn">Update</button>
<p></p>
<p>This is what I require</p>
<input type="text" id="TagsHolder2" name="TagsHolder2" value="test 1,test 2,test 3" />

我的Javascript（我被困住了）：

$(document).ready(function(){
  $("#btn").click(function(){
       $.each($('.tag-label'), function (index, value) {
           $("#TagsHolder").val(index);
       });
    });
});

Answer 1

您可以使用.map获取数组，然后加入,

var values = $(".tag-label").map(function() {
    return $(this).text();
}).get().join(",");

$("#TagsHolder").val(values);

小提琴：http://jsfiddle.net/7wrg611k/3/

Answer 2

您的方法存在一些问题。

index是当前元素的数组索引，而不是它的文本。

你的循环将替换每次传递的值，因此只会看到最后一个值，因为每个先前的值集都将被替换

最好的办法是创建一个数组并加入该数组：

 $("#btn4").click(function () {
    var values = $('.tag-label').map(function () {
        return $(this).text();
    }).get().join();
    $("#TagsHolder").val(values);
});

的 DEMO

获取每个span类的值并将字符串输入到输入中

2 个答案: