Question

Html代码：

<form>
    <table>
        <tr>
            <td>Value</td>
            <td class="to">ABC</td>
        </tr>
    </table>
</form>
<div class="from" style="display:none;">
    <label>
        <input type="text" value="" placeholder="Number"/>
    </label>
</div>

和这个javascript代码：

$(document).ready(function(){
          var values = [12,11,15];
          var cloned = $('div.from').find('label').clone();
          $('td.to').empty();
          for(var i=0;i<values.length;i++){
              cloned.find('input').val(values[i]);
              //console.log(cloned);
              console.log(cloned.find('input').val());
              $('td.to').append(cloned);
          }
});

我在这里试图克隆嵌套的label＆＃39;来自隐藏的div＆＃39; div.from＆＃39;并设置＆＃39; values＆＃39;中的一个值数组并附加到空的＆＃39; td.to＆＃39;使用相同的克隆对象。据我所知，数组的最后一个值似乎是在克隆后附加的。结果应该是三个克隆的嵌套标签，其值填充在＆{39; values＆＃39;的输入框中。阵列。

这是jsbin链接：http://jsbin.com/yuyaqu

Answer 1

每次迭代需要clone()次，所以将该行放在for中：

var values = [12,11,15];
$('td.to').empty();
for (var i = 0; i < values.length; i++){
    var cloned = $('div.from').find('label').clone();
    cloned.find('input').val(values[i]);
    $('td.to').append(cloned);
}

Jquery clone（）无法按预期工作

1 个答案: