0

我正在尝试使用 detach 删除我网站的一个区域,因为我想再次使用它,这就是我在 HTML 中编码的内容

<div id="container">
 <p>Hello</p> 
</div>
<div id="containerShow"></div>

<a href="#" id="remove">Remove</a> | <a href="#" id="show">Show</a>

这是我的 Jquery

$("#remove").click(function(){   
   $("#container").detach();
});

$("#show").click(function(){   
   $("#container").detach().appendTo("#containerShow");
});

应该做的是在单击链接“删除”时删除 div 容器,并在单击链接“显示”时返回相同的信息我知道这看起来很简单,但是 jquery 中关于分离的文档很混乱http:// api.jquery.com/detach/我想要一个简单的方法来做到这一点,我还在这里找到了这篇文章How to I undo .detach()? 但我没有让它按我的意愿工作。

我的代码很好地删除了我的内容,但我不知道如何取回它。请问有什么帮助吗?

4

2 回答 2

1

您已经得到了为什么无法使用 恢复元素的答案detach,但是对于示例中描述的问题,更简单的解决方案是使用hideand appendTo

$("#remove").click(function(){   
   $("#container").hide();
});
$("#show").click(function(){   
   $("#container").appendTo("#containerShow");
});

这是appendTo可行的,因为如果元素已经存在于 DOM 中,它将移动一个元素(在这种情况下它仍然存在,因为hide只是隐藏它,而不是实际删除它)。它还消除了对潜在全局变量存储分离元素的需要。

如果#containerShow除了提供一个放回内容的地方之外什么都不做,您可以摆脱它并show改用:

$("#show").click(function(){   
   $("#container").show();
});
于 2011-10-26T21:28:15.030 回答
0

你必须把它放在某个地方,即在一个变量中:

var element;

$("#remove").click(function(){   
   element = $("#container").detach(); // detach and store in variable
});

$("#show").click(function(){   
   element.appendTo("#containerShow"); // restore stored element
});
于 2011-10-26T21:25:29.387 回答