jQuery if 语句检查可见性

Question

我正在尝试编写一个脚本，该脚本将根据其他元素的可见性隐藏/显示 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();
        }
    });   

我不知道它是否写得正确，但它可以工作；)感谢大家的帮助!

Answer 1

您可以使用 .is(':visible') 测试某些内容是否可见，并使用 .is(':hidden') 测试相反的情况:

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

引用:

• http://api.jquery.com/is/
• http://api.jquery.com/visible-selector/
• http://api.jquery.com/hidden-selector/