注意：

Question

我想做的很简单，设置div的高度取决于高度。所以当网站加载高度为45px时，点击按钮后高度为100px。下次点击后，我希望我的身高恢复到45px。我使用的是jQuery，代码如下： http://codepen.io/zlyfenek/pen/pAcaw 感谢您的帮助，因为我是jQuery的新手。

Answer 1

您可以使用jQuery的.toggleClass()功能。

$(function(){
    $('.yourButton').click(function(){
       $('.yourDiv').toggleClass('big');
    });
});

演示：http://jsfiddle.net/FYyU6/

注意：

您的big css课程应该在您的小班Order Matters之后。

Answer 2

将$("button").one更改为$("button").on

Answer 3

您应该只有一个将高度设置为100px的类，然后在单击按钮时切换它：

.opened { height: 100px; }

$("button").on("click", function() {
    $(".con_b").toggleClass("opened");
})

Answer 4

 function showHeight(ele, h) {
$("div").text("The height for the " + ele +
" is " + h + "px.");
}

// use .on instead of .one, .one will online listen for a click one time, 
// so your second click will not be seen
$("button").on('click', function () {
  if ($(".con_b").height() == 45)
  {
    $(".con_b").height(100);
  }
  else
  {
    // show height and change height should be two different actions
    $('.con_b').height(45);
    showHeight(".con_b",$(".con_b").height());
  }

 });

Answer 5

 function showHeight(ele, h) {
$("div").text("The height for the " + ele +
" is " + h + "px.");
}
$("button").on('click', function () {

  if ($(".con_b").height() == 45)
  {
    $(".con_b").height(100);
  }
  else
  {
    $(".con_b").height(45);
  }

其$("button").on而非$("button").one

javascript设置高度

5 个答案:

注意：