jquery 在 .remove() 之后清除 div 中的空间答案

【问题标题】：jquery clear the space in div after .remove()jquery 在 .remove() 之后清除 div 中的空间
【发布时间】：2013-12-12 21:33:52
【问题描述】：

复选框被动态添加到 div1：

$.each(json, function(idx, obj) {

$("#tbl1").append('<input type="checkbox" id='+obj.firstId+' onclick=nextPopulate('+obj.firstId+'); >'); }

在选择这些时，复选框会动态添加到 div2：

$.each(json, function(idx, obj) {

$("#tbl2").append('<label id="chk'+firstId+'"><input type="checkbox" id="'+firstId+'-'+secondId+'" ></label>'); }

在取消选中 div1 中的复选框时，将删除在 div2 中创建的相应复选框（标签元素）：

if(!($('#'+firstId).is(':checked')))

    $("[id^=chk"+firstId+"]").remove();

标签内容被删除。但是，空间仍然存在。如果我在div1中再次选择，div2中的复选框将仅在这个空白空间之后创建。

如何在删除内容的同时删除空间。删除后刷新/重新加载 div 会起作用吗？

如果是，那么语法如何。我不想再次访问数据库/调用 onclick fn。只需刷新 div 即可移除 .remove() 标签元素时创建的空间。

【问题讨论】：

【解决方案1】：

第一个答案会起作用。要删除<br>，只需这样做：

$('br').remove(); // https://stackoverflow.com/questions/2513848/how-to-remove-nbsp-and-br-using-javascript-or-jquery

如果你有更多的id：

$("[id^=chk"+firstId+"]").remove('br');

【讨论】：

【解决方案2】：

.remove()

会起作用。但请确保所有组件尤其是

<br/>

等被放置在父元素内并被移除。那么空间问题就解决了。下一个追加将追加到 div 中的正确空间。

【讨论】：

【解决方案3】：

“.remove()”函数是从调用的元素中删除子元素，而不是删除调用的元素。所以使用下面的代码，只删除了复选框输入元素，而标签元素仍然保留。

$("[id^=chk"+firstId+"]").remove();

调用remove()的元素应该是"tbl2"，将参数"[id^=chk"+firstId+"]"传入函数中定义要删除的子元素如下：

$("#tbl2").remove("[id^=chk"+firstId+"]");

【讨论】：

这不起作用。但我尝试使用 '$("#tbl2").has("[id^=chk"+firstId+"]").remove();'我认为这具有相同的逻辑。但问题是这将删除整个 div。我只是想删除相应的复选框。