jQuery可拖动删除而不改变其他元素的位置

我正在构建一个关于jQuery的页面布局配置系统。 因此，使用我的网站的每个人都可以通过在网页上移动元素来使其变得个性化。 但是，我有一个问题。

我页面上的每个元素都是一个可拖动的div，如果需要，可以选择从页面中删除。 当用户想要删除元素时，他点击内部div并调用以下函数：

 $(function() { $('.close').click(function(){ $(this).parent().hide(); }); });  
 

当用户想要在页面上添加元素时，他点击链接并调用followinf函数：

 function addNewWidget(page_name, size){ var page = $('#'+page_name); var closeDiv = $(document.createElement("div")).attr("class", "close").html('X'); closeDiv.click(function(){ $(this).parent().hide(); }); var div = $(document.createElement("div")) div.attr("class", "drag"); div.appendTo(page); closeDiv.appendTo(div); div.draggable({ containment: "#page", scroll: false, grid: [200, 200] }); div.css("top:0; left:0"); div.addClass(size); div.addClass('widget'); } 

一切正常，但当元素被删除时，页面上的其他元素正在向上移动。 这是因为代码中的元素定位。 代码中的这些div在div之前，已被删除，其绝对顶部由-heghtOfRemovedElement更改

有没有办法阻止其他元素向上移动？

Answer 1

当我在寻找一个完全不同但又有同样问题的解决方案时，我遇到了你的问题：从容器中取出一个元素时，其他元素会随意移动。

我不确定我最终解决的解决方案是否会对你有所帮助，但是如果它确实…它只是确保你的元素被设置为position：absolute。 我也在使用拖放function。 事实certificate，当您进入“可放置”区域时，不会隐式设置position：absolute属性，因此您必须手动执行此操作。