1

查看我的 jsFiddle http://jsfiddle.net/JV8eU/

我已经使用 jQuery函数克隆了div标签clone()

当有人单击“添加新”时，div将添加新的标签克隆，当有人单击“删除”时，该div标签将被删除。

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

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

4

6 回答 6

3

首先在删除按钮 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>
于 2013-02-11T08:19:48.687 回答
2

你是这个意思吗？http://jsfiddle.net/JV8eU/11/

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

于 2013-02-11T08:29:32.250 回答
2

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

e.preventDefault();

这个 JSFiddle 似乎工作得很好：http: //jsfiddle.net/turiyag/JV8eU/9/ 如果您还想维护初始元素，这段代码可以解决问题：http: //jsfiddle.net/turiyag/ JV8eU/13/

于 2013-02-11T08:29:56.647 回答
0

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

<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/

于 2013-02-11T08:31:11.280 回答
0

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

这是 JsFiddle

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

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

于 2013-02-11T08:33:36.053 回答
0

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

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

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

于 2013-02-11T08:55:33.613 回答