Javascript 创建在同一页中单独工作的克隆div

我在我的页面中有一个div，其中包含一个带有id的输入的表，我在Javascript代码中编写了一些关于输入的条件和函数。我正在尝试做的是创建一个按钮addnew，它克隆页面中完全相同的div，但在新元素上具有相同的条件和功能，并使用submit按钮分别为每个元素工作

我试过这个：

$('#button-add').bind({  
    click: function()
    {
        $("#repeat").clone().appendTo("#add");
    }                
});

问题是，我得到了相同的div外观，但函数不起作用，因为输入具有相同的id，我不能只提交该块新div

---

有没有更简单的方法来实现这一点

因为要复制div，所以不应该使用id，因为它们的唯一性会受到影响。但是您可以使用css类名$'.className'或自定义数据属性$'[data my id=xxx]'来处理输入，因为它们不需要是唯一的

---

其次，您需要克隆div，以便也克隆连接到输入的事件。查看jQuery文档中的.clone[withDataAndEvents][，deepWithDataAndEvents]。

以防您忽略创建克隆。 使用动态id执行此操作的方法

假设在javascript中使用随机函数为每个元素添加具有不同id的div

   $('#add-item').on('click', function (e) {
                        var num = Math.floor(Math.random() * 90000) + 10000;
                        var numtd = Math.floor(Math.random() * 50000) + 10000;

                        $('<tr id="trowdynamic_' + num + '">' +
                            '<td>' +
                                '<div class="input-group">' +
                                '<input type="hidden" id="selected_item_' + numtd + '" name="selected_name" />' +
                                    '<input type="text" name="Inv_Itemsdetail" value="" class="Itemsdetail-typeahead_' + numtd + ' input-search" autocomplete="off" data-provide="typeahead" />' +
                                    '<input type="hidden" id="Inv_Itemsdetail_' + numtd + '" class="auto-complete" name="Itemxx[]" />' +
                                    '<span class="input-group-btn">' +
                                        '<a href="#" data-toggle="modal" class="btn btn-primary" data-target="#cardCode05"><i class="fa fa-plus"></i></a>' +

                                    '</span>' +
                                '</div>' +
                            '</td>' +'</tr>').appendTo('#yourcontainer_id');
});

---

由于新div是在新空间中创建的，即在“添加”中，选择新div作为

#add #repeat
{

}   //  in css

在jquery中，使用next或兄弟姐妹或子对象等来选择新的div

比如说

---

请参见

使用类而不是id，然后查看委派事件。当您动态添加元素时，您将必须倾听从这些新元素到从一开始就存在的元素（如Body）的事件。问题是，我的div中有相互依赖的输入。如果我创建一个类，那么当用户在第一个div的输入中选择某个内容时，它将更改第二个div two中的值，这是我不希望发生的。我希望每个新的div以某种方式作为一个单独的页面单独工作。您可以为每个主div设置一个新ID，然后在该div中寻址输入：$'mainDiv_1.someInputClassName'。或者，在输入的事件处理程序中，仅在父主div中搜索其他输入：$this.closest'.mainDivClass'.find'.someInputClass'是否有方法选择以id开头的所有id，而不考虑id后面的随机数，因为我有javascript函数，应该应用于新div中新生成的元素。如果ID是在之后用随机数生成的，我怎么能选择它们呢？@oday，我在最后一行也提到过。身份证随机来是的，谢谢！我使用了您的解决方案，然后修改了函数以接受带有新生成ID的参数。

#add #repeat
{

}   //  in css