如何使用 . hide () 、.show () 或.toggle () 来切换元素的可见度 ?

如果元素可见或隐藏, 我如何测试 ?


当前回答

if ( $(element).css('display') == 'none' || $(element).css("visibility") == "hidden"){
    // 'element' is hidden
}

上述方法不考虑父(父)的可见度。 如果要也考虑母( 父) , 您应该使用 .is (“ 隐藏 ” ) 或.is ( “ 可见 ” ) 。

例如,

<div id="div1" style="display:none">
  <div id="div2" style="display:block">Div2</div>
</div>

上述方法将考虑在以下两种情况下显示可见的 div2 : 看不到 。 但上述方法在许多情况下可能有用, 特别是当您需要找到隐藏的父( 隐藏的父( 隐藏的父) 中是否存在错误时, 因为在这种情况下 : 可见的不会起作用 。

其他回答

您可以在显示或隐藏 cs 类时,通过切换该类来使用该 Cs 类 :

.show{ display :block; }

设置您的 jquery toggle类 () 或添加类 () 或删除类 () 。

举个例子,

jquery (' myid'. 切换类 ('show')

当元素没有显示时, 上面的代码会添加显示 cs 类, 而当元素显示类别时, 将会删除 。

当你在检查它是否可见时, 你可以遵循这个拼字码,

jquery ('mid'.) 有类('show');

上面的代码将返回一个布尔, 当 Myid 元素含有我们的类( show) , 而当它没有( show) 类( show) 时则返回一个布尔 。

这个问题最简单的答案是:

function checkUIElementVisible(element) {
    return ((element.css('display') !== 'none') && (element.css('visibility') !== 'hidden'));
}
   hideShow(){
  $("#accordionZiarat").hide();
  // Checks CSS content for display:[none|block], ignores visibility:[true|false]
  if ($("#accordionZiarat").is(":visible")) {
    $("#accordionZiarat").hide();
  }

  
  else if ($("#accordionZiarat").is(":hidden")) {
    $("#accordionZiarat").show();
  }

  else{

  }

我只是想澄清一下, 在杰奎里,

元素可以被视作隐藏, 原因有几个: 它们有一个 css 显示值为零 。 它们是类型=“ 隐藏” 的形状元素。 它们的宽度和高度被明确设置为 0。 祖先元素被隐藏, 因此该元素不会在页面上显示 。 有可见度的元素: 隐藏或不透明: 0 被视为可见, 因为它们仍然在布局中消耗空间 。 在隐藏元素的动画中, 该元素被视为可见, 直到动画结束 。 sourc

if($('.element').is(':hidden')) {
  // Do something
}

下面的代码检查,如果元素隐藏在jquery或可见

// You can also do this...

        $("button").click(function(){
            // show hide paragraph on button click
            $("p").toggle("slow", function(){
                // check paragraph once toggle effect is completed
                if($("p").is(":visible")){
                    alert("The paragraph  is visible.");
                } else{
                    alert("The paragraph  is hidden.");
                }
            });
        });