Question

我有这个代码。如果我的div{display:block} alert('yes') esle，那该怎么办？ div{display:none} alert('no')

<div class="C-1"></div>

<script>
if ( Boolean ( $('.C-1').show() ) == true ) { alert('yes' }
if ( Boolean ( $('.C-1').show() ) == false ) { alert('no') }
</script>

或

if ( Boolean ( $('.C-1').css({'display':'block'}) ) == true ) { alert('yes' }
if ( Boolean ( $('.C-1').css({'display':'block'}) ) == false ) { alert('no') }

但此代码不起作用！

那你的建议是什么？

Answer 1

使用:visible和:hidden伪选择器。

检查元素是否为visible：

$('.C-1').is(':visible')

如果元素true可见，则返回.C-1，否则返回false。

文档：https://api.jquery.com/visible-selector/

检查元素是否隐藏：

$('.C-1').is(':hidden')

如果隐藏了元素true，则会返回.C-1，否则会返回false。

文档：https://api.jquery.com/hidden-selector/

您的代码

if ($('.C-1').is(':visible')) {
    alert('Yes');
} else {
    alert('No');
}

Answer 2

您可以将.is()与:visible选择器一起使用：

if($('.C-1').is(':visible')){
  alert('yes'); 
}else{
  alert('no');
}

Answer 3

选中是（'：可见'）。

如果您有检查div是否可见，请使用:visible并隐藏div，在jquery中使用:hidden psudeo选择器

if($('.C-1').is(':visible')){
   // div is visible
}
else {
   // div is not visible
}

Answer 4

if($('.C-1').css('display') === 'none'){
   //hidden
}else{
   // shown
}

show（）或hide（）函数的布尔值

4 个答案: