当项目从中删除时,如何删除div的高度

时间:2015-09-16 05:56:50

标签: javascript jquery css

我在div中显示了一个项目列表。单击任何项​​目时,它将附加到上面的div。我没有为这个div设置任何高度。这里的项目将在每个项目旁边显示一个删除图标。删除后,该特定项目将附加到它所源自的div之下。现在问题是,随着项目添加到上面的div,它的高度增加,一旦项目被删除,我预计高度也会减少,但它保持不变。因此,当我在上面的div中添加一个项目时,它会变得更长。如何删除第一个div的高度?

下图描述了流程:最后一张图片显示了从第一个红色框中删除所有项目并将新项目添加到其中后会发生的情况。

enter image description here enter image description here enter image description here

这是我点击删除按钮时发生的代码。

 function hide_rate(param)
 {

     //remove item
     $("#wrapper_"+param).text(" ");
     $("input[name=rate_"+param+"]").val(" ");
     $("input[name=rate_"+param+"]").empty();
     $(".cross_"+param).text(" "); 
     $("#moveItem").css("background-color","#ff0000");
     //add back removed item

     $("#displaySubItems").append($(".sub_"+param+" span").text()+"<br/>");

 }

1 个答案:

答案 0 :(得分:3)

使用函数empty():保留DOM中的元素,例如:

<div class="hello">Hello</div>
<div class="goodbye">Goodbye</div>

$("div.hello").empty();

只会删除div中的文本Hello,从而保留div,从而保留SPACE

ie. it wil result in
<div class="hello"></div>
<div class="goodbye">Goodbye</div>

但是,使用remove()将从DOM中删除元素,因此可以消除由于使用empty()而保留的空间。

所以,请使用 $("div.hello").remove();获得所需的输出即

<div class="goodbye">Goodbye</div>