Question

所以我希望div（#more）在点击另一个div（105px）后将其高度从25px更改为#clck。我有点做过：

 <script type="text/javascript">
$("#clck").click(function () {
$("#more").css("height", "325");
});
</script>

但在第一次点击后，它不会回到其初始高度。我试过了toggleClass但它没有用。

有人可以帮我这么做吗？

Answer 1

尝试在新的CSS类中设置高度，并使用toggleClass切换此类。

例：
HTML：

<div id="myDiv">...</div>

CSS：

#myDiv {
   height: 105px;
}

#myDiv.expanded {
   height: 325px
}

JS：

$("#myDiv").toggleClass("expanded");

Answer 2

Toggle height of div using jQuery。可以将.data（）。removeFata（）与if / else一起使用，因为这个人只是演示了

Answer 3

查看jsfiddle demo

$("#clck").click(function () {
    if($("#more").css("height")=="105px") // check for height
        $("#more").css("height", "325");
    else
        $("#more").css("height", "105");
});

Answer 4

如果你想在每次点击时切换高度，你可以使用一个标志变量来记住当前的高度。

var flag = false;
$("#clck").click(function(){
    if(flag){
        $("#more").css("height", "325");
        flag = false;
    }
    else{
        $("#more").css("height", "105");
        flag = true;
    }
});

如何切换div的高度

4 个答案: