关于javascript：jquery如何检查是否隐藏了一个元素


how to check if one element is hidden with jquery

本问题已经有最佳答案，请猛点这里访问。

我想显示和隐藏一个分区，如下所示：

1
2
3
4
5
6
7
8
9
$('#Div1').click(function () {
            if ($("#Div2").hidden) {
                $("#Div2").show(500);
            }
            else {
                $("#Div2").hide(1000);
            }

        });

此代码不起作用。

我想通过点击页面的空白部分来隐藏div2，我该怎么做呢？我的代码哪里出错了？

相关讨论

hidden不是jquery对象的属性。试试is(':hidden')。

1
2
3
4
5
6
7
8
9
  $('#Div1').click(function () {
        if ($("#Div2").is(':hidden')) {
            $("#Div2").show(500);
        }
        else {
            $("#Div2").hide(1000);
        }

  });

如果时间相同，您可以简单地使用toggle()，根据当前的可见性，hide或show。

1
2
3
  $('#Div1').click(function () {
       $("#Div2").stop().toggle(500);
  });

正如@A.Wolff建议的那样，为了允许多次点击，使用EDOCX1[5]并停止正在进行的任何现有动画：

1
2
3
4
5
6
7
8
  $('#Div1').click(function () {
        if ($("#Div2").stop().is(':hidden')) {
            $("#Div2").show(500);
        }
        else {
            $("#Div2").hide(1000);
        }
  });

第2部分：

要在单击页面上其他任何位置时隐藏DIV，请侦听单击document：

例如

1
2
3
 $(document).click(function(){
     $("#Div2").stop().hide(1000);
 });

但要使其正常工作，您不能允许单击div1传播到文档，因此将第一部分更改为在第一个事件参数上也使用stopPropagation()：

1
2
3
4
5
6
7
8
9
  $('#Div1').click(function (e) {
        e.stopPropagation();       // stop click propagating to document click handler
        if ($("#Div2").is(':hidden')) {
            $("#Div2").show(500);
        }
        else {
            $("#Div2").hide(1000);
        }
  });
相关讨论