jQuery if语句来检查可见性

我试图写一个脚本,将隐藏/显示div取决于其他元素的可见性。 当我点击其他元素时,该行为应该发生。 这是我迄今为止写的:

$('#column-left form').hide(); $('.show-search').click(function() { $('#column-left form').stop(true, true).slideToggle(300); if( $('#column-left form').css('display') == 'none' ) { $("#offers").show(); } else { $('#offers').hide(); } }); 

它隐藏了div,但隐藏表单时不会回来。 将是伟大的任何帮助:)

编辑:

好吧,我已经设法达到预期的效果,写下这个:

 $('#column-left form').hide(); $('.show-search').click(function() { if ($('#column-left form').is(":hidden")) { $('#column-left form').slideToggle(300); $('#offers').hide(); } else { $('#column-left form').slideToggle(300); $("#offers").show(); } }); 

我不知道它是否正确写入,但它的工作原理;)谢谢大家的帮助!

您可以使用.is(':visible')来testing是否可见,并使用.is(':hidden')来testing相反的结果:

 $('#offers').toggle(!$('#column-left form').is(':visible')); // or: $('#offers').toggle($('#column-left form').is(':hidden')); 

参考:

是的,你可以在jQuery中使用.is(':visible') 。 但是,当代码在safari浏览器下运行.is(':visible')是行不通的。

所以请使用下面的代码

 if( $(".example").offset().top > 0 ) 

以上行将同时工作IE浏览器以及safari。

尝试

 if ($('#column-left form:visible').length > 0) { ... 
  $('#column-left form').hide(); $('.show-search').click(function() { $('#column-left form').stop(true, true).slideToggle(300); //this will slide but not hide that's why $('#column-left form').hide(); if(!($('#column-left form').is(":visible"))) { $("#offers").show(); } else { $('#offers').hide(); } }); 

修复了与使用.is(“:visible”)相关的性能问题之后,我build议不要使用上面的答案,而是使用jQuery的代码来判断单个元素是否可见:

 $.expr.filters.visible($("#singleElementID")[0]); 

所做的是检查一组元素是否在另一组元素中。 所以你会在页面上的整个可见元素集中寻找你的元素。 有100个元素是非常正常的,可能需要几毫秒来search可见元素的数组。 如果你正在build立一个networking应用程序,你可能有数百甚至数千个。 我们的应用程序有时会花费100ms $(“#selector”)is(“:visible”),因为它检查一个元素是否在5000个其他元素的数组中。

如果可见。

 $("#Element").is(':visible'); 

如果它隐藏。

 $("#Element").is(':hidden');