测试一个元素时:hidden在 jQuery 中选择器一个绝对定位元素可能被确认为隐藏,尽管其子元素是可见的.

虽然仔细看一看jQuery文件提供了相关信息,

要素可被视为隐藏,原因如下:[.]其宽度和高度明确定为0。 [.]

因此,在框模型和元素的计算样式方面,这实际上是有道理的。即使没有设置宽度和高度明确无误可设定 0 个至 0个隐含.

举例如下:

console.log($('.foo').is(':hidden')); // true
console.log($('.bar').is(':hidden')); // false

.foo {
  position: absolute;
  left: 10px;
  top: 10px;
  background: #ff0000;
}

.bar {
  position: absolute;
  left: 10px;
  top: 10px;
  width: 20px;
  height: 20px;
  background: #0000ff;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="foo">
  <div class="bar"></div>
</div>

jQuery 3. x 的更新 :

当 j 查询 3 时, 描述的行为将会改变 ! 如果元素有任何布局框, 包括宽度和/ 或高度为零的布局框, 元素将被视为可见 。

JSF与jQuery 3. 0.0- 阿尔法1:

http://jsfiddle.net/pM2q3/7/

同样的 JavaScript 代码将会有此输出 :

console.log($('.foo').is(':hidden')); // false
console.log($('.bar').is(':hidden')); // false

我只是想澄清,在jQuery,

某些要素可被视为隐藏,原因如下:

• 它们有一个 CSS 显示值, 没有任何值 。
• 它们组成元素 类型 = "隐藏" 。
• 它们的宽度和高度明确定为0。
• 隐藏了祖先元素,所以该元素不在页面上显示。

具有可见度的要素: 隐藏或不透明: 0 被视为可见, 因为它们仍然在布局中消耗空间 。 在隐藏元素的动画中, 该元素被视为可见, 直到动画结束 。

资料来源:隐藏选择器 jQuery API 文件

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

if($("h1").is(":hidden")){
    // your code..
}

而不是撰写event每一单element,这样做:

$('div').each(function(){
  if($(this).css('display') === 'none'){
    $(this).css({'display':'block'});
  }
});

您也可以在以下输入中使用:

$('input').each(function(){
  if($(this).attr('type') === 'hidden'){
    $(this).attr('type', 'text');
  }
});

if($('#id_element').is(":visible")){
   alert('shown');
}else{
   alert('hidden');
}

通常当检查某物是否可见时, 您会立即直接去做其他事情。 jQuery 链条让事情变得容易。

所以,如果您有一个选择器, 并且只有显示或隐藏时才想要对它执行某些动作, 您可以使用filter(":visible")或filter(":hidden")然后用您想要采取的行动链绑住它。

所以,而不是一个if语句, 像这样的语句 :

if ($('#btnUpdate').is(":visible"))
{
     $('#btnUpdate').animate({ width: "toggle" });   // Hide button
}

或更有效率,但更丑陋:

var button = $('#btnUpdate');
if (button.is(":visible"))
{
     button.animate({ width: "toggle" });   // Hide button
}

你可以单行完成所有任务:

$('#btnUpdate').filter(":visible").animate({ width: "toggle" });