1

我的页面上有 3 个隐藏的 div，以及一个可见的通用“欢迎”消息。这些 div 的左侧是一些项目，单击这些项目会切换它们各自的 div（以及其他 div）。这一切都按预期工作。

var $jq = jQuery.noConflict(true); 
$jq(function() { 
$jq("#fade1").click(function(){ 
    $jq("#div1").fadeToggle(750); 
    $jq("#div2").fadeOut(1); 
    $jq("#div3").fadeOut(1);
    $jq("#welcomediv").fadeOut(1);
}); 
$jq("#fade2").click(function(){ 
    $jq("#div1").fadeOut(1); 
    $jq("#div3").fadeOut(1); 
    $jq("#div2").fadeToggle(750); 
    $jq("#welcomediv").fadeOut(1);
}); 
$jq("#fade3").click(function(){ 
    $jq("#div1").fadeOut(1); 
    $jq("#div2").fadeOut(1); 
    $jq("#div3").fadeToggle(750);
    $jq("#welcomediv").fadeOut(1);
});
});

然后我尝试添加一个 if 语句，告诉欢迎消息在没有其他可见的情况下显示自己，例如，如果用户单击一个将其淡入，然后再次单击它以将其淡出。目前的行为只会为用户留下空白空间。

        if ($jq("#div1:hidden") && $jq("#div2:hidden") && $jq("#div3:hidden")){
    (function(){
        $jq("#welcomediv").fadeIn(500);
    });
};

我也试过直接检查 CSS，比如

if ($jq("#div1").css("display", "none") && $jq("#div2").css("display", "none") &&     $jq("#div3").css("display", "none") {
    $jq("#welcomediv").fadeIn(500);
});

或者

if ($('div.x').css('height') === 'auto') {
$('.y').removeClass('a');

}

这些似乎都不起作用。当点击各自的链接时，div 仍然淡入淡出，但我的 if 语句什么也不做。想法？

4

1 回答 1

0

要检查元素是否不可见，请使用：

if ($jq(selector).is(':hidden') && ... )

您还应该能够使用以下命令检查所有三个是否可见：

if ($jq('#div1:hidden,#div2:hidden,#div3:hidden').length === 3) { ... }
于 2013-03-26T18:54:13.413 回答