Question

我设置了以下JSFiddle。目前，我有三个div，每个div都有自己的输入。每个输入都有一个复选框，可以添加另一个输入。如果未选中，则再次删除输入。这个代码是

 $(function() {
   $('input:checkbox[name="labelNewline"]').change(function() {
     if ( $(this).is(':checked') ){
       var clone = $(this).parent().siblings(".labelAndInput").first().clone().insertAfter($(this).parent());
       clone.addClass('clone');
     } else {
            $(this).parent().siblings(".clone").remove();
     }
   });
 });

我现在正在尝试做别的事情。如果添加了新行，则新输入还应该具有能够添加新输入的复选框。因此，我不再希望将此限制为仅添加一个输入。但是，如果未选中输入的复选框，则应删除其相关输入。

这样的事情会成为可能吗？

由于

Answer 1

是的，这是可能的。

这是一个工作小提琴：

https://jsfiddle.net/yvnyk69v/1/

注意事项：

$("#testingContainer").delegate('input:checkbox[name="labelNewline"]', 'change', function() {

委托函数在这种情况下非常有用。它做了什么它需要一个元素，并将事件处理程序应用于任何匹配委托函数中指定的选择器的元素，即使它已在代码已经运行后添加。

UI非常简单，因此我可以使用next和previous来定位元素。如果它变得更复杂，您可能想要添加一个属性或类来更容易地识别相应的输入。

JQuery，不止一次克隆div

1 个答案: