检查 div 是不是使用 jQuery 隐藏

Posted 2023-04-18

【中文标题】检查 div 是不是使用 jQuery 隐藏

【英文标题】：Check div is hidden using jQuery检查 div 是否使用 jQuery 隐藏

【发布时间】：2012-01-19 00:48:08

【问题描述】：

这是我的 div

<div id="car2" style="display:none;"></div>

然后我有一个显示按钮，当您单击时会显示 div：

$("show").click(function() 
    $("$car2").show();
); 

所以现在我想在提交表单之前检查 div #car2 是否仍然隐藏：

if($('#car2').is(':hidden')) 
    alert('car 2 is hidden');

现在问题来了。虽然 div #car2 已经显示，但我仍然收到警告消息，这意味着 jQuery 假定 div #car2 仍然隐藏。

我的 jQuery 版本是 1.7。

谢谢。

编辑：

正如jasper所说，我的代码是正确的，可以通过这个demo运行。

我怀疑与我在表单中使用的jQuery form to wizard plugin 存在一些冲突。任何人有任何想法来解决这个问题？

【问题讨论】：

jsfiddle.net/YjP4K/2 您的代码在简化后确实有效，所以您可能在其他地方有错误？

另见Checking if an element is hidden [by jquery]

【参考方案1】：

您可以检查 CSS display 属性：

if ($('#car').css('display') == 'none') 
    alert('Car 2 is hidden');

这是一个演示：http://jsfiddle.net/YjP4K/

【讨论】：

虽然其他答案是正确的，但不知何故我只能在我的表单中使用这种方法，所以我会选择这个作为答案。谢谢。

$('#car').is(:hidden) 应该可以工作。这也是比当前解决方案更清洁的解决方案。查看更多api.jquery.com/hidden-selector

@akshay 是的，这更具有语义意义。我认为在某些极端情况下进行自己的检查是有意义的，因为元素周围存在与:hidden 和:visible 选择器相关的条件。

@akshay 您忘记了 :hidden 上的引号。应该是 $('#car').is(':hidden')

【参考方案2】：

试试：

if(!$('#car2').is(':visible'))
  
    alert('car 2 is hidden');       

【参考方案3】：

试试

if($('#car2').is(':hidden'))
  
    alert('car 2 is hidden');       

【参考方案4】：

尝试检查 :visible 属性。

if($('#car2').not(':visible'))

    alert('car 2 is hidden');       

【参考方案5】：

您是否注意到您的拼写错误，$car2 而不是 #car2？

无论如何，:hidden 似乎工作正常，试试here。

【参考方案6】：

你可以使用，

if (!$("#car-2").is(':visible'))

      alert('car 2 is hidden');