Question

我的页面上有一个带有两个文本区域字段的表单，现在我有一个用于向表单动态添加新文本区域+复选框的按钮。我使用clone（）函数来实现这一点并且它有效但我意识到对于复制后它已经克隆我无法检查或取消选中它也检查了原始元素的状态。

这是html：

<div style="position: relative;" class="icheckbox_polaris">
  <input style="position: absolute; top: 10%; left: 10%; display: block; width: 80%; height: 80%; 0px; padding: 0px; background: none repeat scroll 0% 0% rgb(255, 255, 255); border: 0px none; opacity: 0;" class="check" required="required" name="correctAnswer" value="" type="checkbox">
  <ins style="position: absolute; top: 10%; left: 10%; display: block; width: 80%; height: 80%; 0px; padding: 0px; background: none repeat scroll 0% 0% rgb(255, 255, 255); border: 0px none; opacity: 0;" class="iCheck-helper"></ins>
</div>

这是我的javascript：

$('#lnkAddNewAnswer').click(function() {
   $('.answer-txt-area').first().clone().appendTo('.answers-container')
});

我使用iCheck插件作为我的复选框和单选按钮。

Answer 1

如果您更改JS以传递参数＆＃34; true＆＃34;对于克隆方法，它也将克隆所有事件和数据。

有关详细信息，请参阅此link。

$('#lnkAddNewAnswer').click(function() {
   $('.answer-txt-area').first().clone(true).appendTo('.answers-container')
});

如果您有进一步的问题，那么写出新的复选框而不是克隆可能是更好的解决方案。

有些事情如下：

$('#lnkAddNewAnswer').click(function() {
   var checkboxHTML = '<input type="checkbox"/>';
   $('.answers-container').append(checkboxHTML);
   $('input').iCheck();
});

在jquery中克隆没有数据共享的html元素

1 个答案: