Question

我从数据库获取了一些n个输入字段，如下所示：

<span class="" id="row_label">Demo 1</span>
<input type="text" class="input-medium firstrow" name="" id="demo_1" value="Sun" />
<span class="" id="row_label">Demo 2</span>
<input type="text" class="input-medium firstrow" name="" id="demo_2" value="Mon" />
<span class="" id="row_label">Demo 3</span>
<input type="text" class="input-medium firstrow" name="" id="demo_3" value="Tue" />

与此同时，我动态生成一些输入字段，没有如下所示的值。

 <span class="" id="row_label">Demo 1</span>
 <input type="text" class="input-medium firstrow" name="" id="demo_4" value="" />
 <span class="" id="row_label">Demo 2</span>
 <input type="text" class="input-medium firstrow" name="" id="demo_5" value="" />

现在两种类型的输入字段都具有相同的标签。我想通过查看第一种类型的标签来增加第二种类型的标签。

所以，我想将第二类输入字段的标签增加为Demo 4，Demo 5 ..

我该怎么办？

Answer 1

假设你有一个像

这样的容器元素

<div id="container">
    <span class="row_label">Demo 1</span>
    <input type="text" class="input-medium firstrow" name="" id="demo_1" value="Sun" />
    <span class="row_label">Demo 2</span>
    <input type="text" class="input-medium firstrow" name="" id="demo_2" value="Mon" />
    <span class="row_label">Demo 3</span>
    <input type="text" class="input-medium firstrow" name="" id="demo_3" value="Tue" />
</div>

然后

jQuery(function ($) {
    var $ct = $('#container'),
        idx = $ct.find('.row_label').length,
        end = idx + 2;
    for (var i = idx + 1; i <= end; i++) {
        $ct.append('<span class="row_label">Demo ' + i + '</span><input type="text" class="input-medium firstrow" name="" id="demo_' + i + '" value="Sun" />')
    }
})

演示：Fiddle

如何使用javascript / jquery动态增加输入标签

1 个答案: