Question

我使用jQuery div函数

克隆了clone()标记

如果有人点击“添加新”，则会添加div标记的新克隆，当有人点击“删除”时，该div标记将被删除。

有一个问题，原来的div标签还包含删除按钮，所以有人点击它时原来的div标签也被删除了。

我不想在执行代码时显示删除链接，当有人点击添加时，删除链接会显示div标签的克隆。

Answer 1

首先在删除按钮div中将其隐藏起来并在代码中进行以下更改...

$(document).ready(function(){
    $("#Add").click(function(){
        $("#id").removeAttr("hidden");
        $("#id").show("slow");
        var obj =  $("div.content").eq(0).clone(); //this will clone the html elements
        $("div.row").append(obj); //this will append to the existing elements
    });
});

和身体..

<div class="pull-left"><a href="#" onclick='removeDOM(this)' id="id" hidden>Remove</a></div>

Answer 2

这是什么意思？ http://jsfiddle.net/JV8eU/11/

您可以在添加新内容之前动态添加删除div。像这样： obj.append('<div class="pull-left"><a href="#"onclick="removeDOM(this)">Remove</a></div>');

Answer 3

永远记住，当覆盖默认功能时，这是你的朋友：

e.preventDefault();

这个JSFiddle似乎很好用：http://jsfiddle.net/turiyag/JV8eU/9/ 如果您还希望维护初始元素，则此代码可以解决问题：http://jsfiddle.net/turiyag/JV8eU/13/

Answer 4

将行的模板放在单独的元素中：

<div class="template">
  <div class="content">
    ...the row template goes here
  </div>
</div>
<div class="row">
</div>

隐藏模板：

.template { display: none; }

从模板开始复制一次行，并在单击链接时：

function copy() {
    $("div.row").append($(".template .content").clone());
}

$(document).ready(function () {
    copy();
    $("#Add").click(copy);
});

演示：http://jsfiddle.net/JV8eU/14/

Answer 5

想到更好的实施。不要总是隐藏原始的，而是有条件地隐藏它。

Here is JsFiddle

function removeDOM(thisObj){
if($('.content').size() == 2){
    $($('.remove-link').not(thisObj)[0]).hide();
}
if($('.content').size() != 1)
    $(thisObj).parent().parent().remove();
}

好处是，用户可以删除任何他/她想要的行。

Answer 6

从html中删除按钮，并在单击按钮时附加它....

 var newRemoveButton ='<div class="pull-left"><a href="#" onclick='removeDOM(this)' id="id" hidden>Remove</a> </div>';
 $(newRemoveButton).appendTo(obj);

您还可以查看此link以添加一些效果。

jQuery clone（）函数无法正常工作

6 个答案: