Question

我有一个复选框（checked = false）和一个div（display = none）

我点击进入复选框 - div将显示，checked = true
然后再点击 - div将设置为display = none，checked = false。

当我点击复选框时，我想检查div是否显示（设置检查== true），显示“slidingDiv show”并点击进入复选框againt - div是display = none（set checked == false），show “slidingDiv hidden”。

function ShowHide() {
            if ($("#slidingDiv").css(":display") == "none") {
                alert("slidingDiv display none.");
            }
            else {
                alert("slidingDiv show.");
            }

            $("#slidingDiv").animate({ "height": "toggle" }, { duration: 400 });
        }

感谢

Answer 1

您应该使用它来获取显示属性：

var display = $("#slidingDiv").css("display"); //note that there is no leading colon (':')

或者，您可以使用更简单的检查：

if ($("#slidingDiv").is(":visible")) {
  alert("slidingDiv show.");
} else {
  alert("slidingDiv display none.");
}

Answer 2

我认为最好使用这个

function showHide()
{
  if($('#mycheckbox').is(':checked'))
  {
    $("#mydiv").show();
  }
  else
  {
    $("#mydiv").hide();
  }
}

Answer 3

看看我的工作示例：http://jsfiddle.net/Briganti/RDq9j/

玩得开心：）

Answer 4

我认为使用css类将div设置为可见或隐藏会更好。

例如 - 如果您希望默认隐藏它，请设置

<div id="mydiv" class="mydiv"></div>

其中“mydiv”类有display：none; 要显示它，你可以添加“visible”类，它有display：block;

if ($("#mydiv").hasClass("visible")) {
  alert('hide');
  $("#mydiv").removeClass('visible');

} else {
  alert('show');      
  $("#mydiv").addClass('visible');
}

如果'div'是display = none或！= none，请执行一些操作

4 个答案: