JQuery - 如果DIV ID可见

Question

我正试图找出一个 DIV 元素是否被隐藏或者显示。

以下是伪代码：

如果 DIV 隐藏了，
{
  显示内容
}

有 JQuery 方面的专家可以帮助我吗？

谢谢， Robert

- RobertC

Answer 1

如果你只是想显示一个被隐藏的div，那么你实际上根本不需要进行任何检查：

$('#myDiv').show();

无论之前的状态如何，它现在会被显示出来。

但是，如果你想执行其他操作，这取决于内容是否可见，那么你需要进行检查：

if ($('#myDiv').is(":hidden")) 
// or
if ($('#myDiv:hidden').length) 
// or
if ($('#myDiv:not(:visible)')) {    // you get the idea...
    //perform your actions
}

- nickf

---

我不能保证这个测试的完整性，但我刚刚把这三个函数放到jsperf中看看结果如何。似乎.is:hidden是最好的！ http://jsperf.com/is-the-div-hidden - Jacob Raccuia

Answer 2

其他所有答案都很好，但这只是将您的伪代码转换为实际的javascript代码：

if (!$('div').is(':visible')) {
  $('div').show();
}

- eKek0

Answer 3

如果元素被隐藏，以下代码将显示名为myDiv的DIV。请注意，如果您想要执行其他操作，您也可以使用each()而不是show，并在每个内部对$(this)执行其他操作。

$('div#myDiv:hidden').show();

- tvanfosson

---

这有点多余，不是吗？ - nickf

@nickf：只是试图与给定的示例保持一致。 - tvanfosson

Answer 4

这将测试您是否选择了任何 ID 为“mydiv”的隐藏元素：

 if ( $("#mydiv:hidden").length > 0)
 {
    // 
 }

编辑：简化选择器。不得不查一下:/

- womp

Answer 5

如果你只是想隐藏和显示一个元素，那么你可以使用jQuery的.toggle()方法来实现。同样，.slideToggle()和.fadeToggle()方法将使用滑动或淡入淡出动画来隐藏和显示元素。

- user2128205