如何使元素的可见度.hide(), .show(),或.toggle()?

如果一个元素是visiblehidden?


当前回答

这里有一个永久有条件的表达式 来检查元素的状态 然后切换它:

$('someElement').on('click', function(){ $('elementToToggle').is(':visible') ? $('elementToToggle').hide('slow') : $('elementToToggle').show('slow'); });

其他回答

有两种方法可以检查元素的可见度。

解决方案 # 1

if($('.selector').is(':visible')){
    // element is visible
}else{
    // element is hidden
}

解决方案 # 2

if($('.selector:visible')){
    // element is visible
}else{
    // element is hidden
}

只是简单地检查一下这个元素是否是可见可见然后,他将返回尘埃,布尔j 查询,通过添加来隐藏元素无显示无对于元素,所以如果您想要使用纯 JavaScript,您仍然可以这样做,例如:

if (document.getElementById("element").style.display === 'block') {
  // Your element is visible; do whatever you'd like
}

另外,您还可以使用 jQuery , 您的代码的其余部分似乎也使用 JQuery , 您的代码块较小 。 在 jQuery 中, 类似下面的密钥也可以使用相同的密钥 :

if ($(element).is(":visible")) {
    // Your element is visible, do whatever you'd like
};

还使用cssjQuery 中的方法可以产生相同的结果:

if ($(element).css('display') === 'block') {
    // Your element is visible, do whatever you'd like
}

若需要检查可见度和显示度,您还可以做以下工作:

if ($(this).css("display") === "block" || $(this).css("visibility") === "visible") {
   // Your element is visible, do whatever you'd like
}

我找了这个, 没有一个答案是正确的 我的案子是正确的, 所以我创造了一个功能, 返回假的,如果一个人的眼睛看不到元素

jQuery.fn.extend({
  isvisible: function() {
    //
    //  This function call this: $("div").isvisible()
    //  Return true if the element is visible
    //  Return false if the element is not visible for our eyes
    //
    if ( $(this).css('display') == 'none' ){
        console.log("this = " + "display:none");
        return false;
    }
    else if( $(this).css('visibility') == 'hidden' ){
        console.log("this = " + "visibility:hidden");   
        return false;
    }
    else if( $(this).css('opacity') == '0' ){
        console.log("this = " + "opacity:0");
        return false;
    }   
    else{
        console.log("this = " + "Is Visible");
        return true;
    }
  }  
});

您可以使用 jQuery 的is()函数可以检查选定元素的可见或隐藏。该方法沿 DOM 元素沿 DOM 元素绕行查找匹配,以找到符合已传递参数的匹配。如果匹配返回错误,则返回为真实。

<script>
    ($("#myelement").is(":visible"))? alert("#myelement is visible") : alert("#myelement is hidden");
</script>

检查隐藏元素的方法太多。 这是最好的选择( 我只是推荐你):

使用 jQuery, 在 CSS 中设定隐藏的元素“ 播放: noone ” 。

重点是:

$('element:visible')

以及一个可供使用的例子:

$('element:visible').show();