我的目标是在表单中的 Bootstrap 行上进行克隆以收集用户的输入。基本上它与 this thread 完全相同。 。然而,由于某种原因,我遇到了奇怪的克隆行为,有一段时间我真的感到困惑。
这是我拥有的 DOM:
<div class="cloned-row">
<div class="row" id="row_1">
<div class="col-md-12">
<div class="form-group">
// some inputs here
</div>
</div>
</div>
<div class="row" id="row_2">
<div class="col-md-12">
<div class="form-group">
// some inputs here
</div>
</div>
</div>
</div>
我正在克隆 .cloned-row
的列表子项(在本例中为 ID 为 row_2
的行),并希望将其作为第三行。 (我还将在克隆行后更改 id,但这将在稍后进行,因为我仍然遇到克隆问题)但由于某种原因,我的克隆 jQuery 代码克隆了这两行。所以克隆之后就变成了 4 行。下面是我的 jQuery 克隆部分:
$(document).on('click', '#plus_now', function(){
$(".cloned-row:last").clone().insertAfter(".cloned-row:last");
});
正在寻求有关此问题的指导。这完全出乎意料。非常感谢,谢谢。
最佳答案
您正在克隆整个 .cloned-row
元素 - 尝试:
$(document).on('click', '#plus_now', function(){
$(".cloned-row .row:last-child").clone().insertAfter(".cloned-row .row:last-child");
});
仅克隆最后一个 .row
元素
关于javascript - jQuery 奇怪的 Bootstrap 行克隆行为,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41193437/