If/Else Statement does not run the else

-2

Here is my JSFiddle：If/Else Statement does not run the else

我正在努力处理我的If/Else语句。我无法让语句的其他部分运行。我认为这是排序的东西...但我没有尝试一直在帮助。

我想要发生的事情：点击粉红色按钮，出现小粉红色。点击绿色的按钮，出现小绿框，粉红色消失。

下面是HTML：

<div id="pport01"></div> 
<div id="pport02"></div> 
<div class="p01"></div> 
<div class="p02"></div>

这里是CSS：

#pport01{ 
    position:relative; 
    display: inline-block; 
    width: 100px; 
    height:100px; 
    background-color: pink; 
    cursor: pointer; 
} 

#pport02{ 
    position:relative; 
    display: inline-block; 
    width: 100px; 
    height:100px; 
    background-color: green; 
    cursor: pointer; 
} 

.p01{ 
    position:relative; 
    display: none; 
    width: 10px; 
    height:10px; 
    background-color: pink; 
    display: none; 

} 

.p02{ 
    position:relative; 
    display:none; 
    width: 10px; 
    height:10px; 
    background-color: green; 
}

这里是JS：

var active01 = false; 
var active02 = false; 

$('#pport01').click(function(){ 
    active02= false; 
    active01 = true; 
    if(active01){ 
     console.log(active01 + "port1 true"); 
     $('.p01').fadeIn("slow"); 
    }else{ 
     console.log(active01 + "port1 false"); 
     $('.p02').fadeOut("slow"); 
    } 
}); 

$('#pport02').click(function(){ 
    active01 = false; 
    active02 = true; 
    if(active02){ 
     console.log(active02 + "port2 true"); 
     $('.p02').fadeIn("slow"); 
    }else{ 
     console.log(active02 + "port2 false"); 
     $('.p02').fadeOut("slow"); 
    } 
});

事实证明，如果我不想要的/ else语句。谢谢你们每一个人的帮助！ It works now!

来源

2015-05-06 Kay

根据您的代码：

$('#pport01').click(function(){ 
    active02= false; 

// active01 is set to true before the IF 

    active01 = true; 
    if(active01){ 
     console.log(active01 + "port1 true"); 
     $('.p01').fadeIn("slow"); 
    }else{ 
     console.log(active01 + "port1 false"); 
     $('.p02').fadeOut("slow"); 
    } 
});

active01总是为真时if解决了，所以其他人永远不会被评估。你应该重新思考你打算实现的目标。

也许你并不需要，如果：

$('#pport01').click(function(){ 
     $('.p01').fadeIn("slow"); 
     $('.p02').fadeOut("slow"); 
}); 

$('#pport02').click(function(){ 
     $('.p02').fadeIn("slow"); 
     $('.p01').fadeOut("slow"); 
});

来源

2015-05-06 00:33:15

是的，这是有道理的！但我似乎无法想出解决方案。 – Kay

如果我错了，请纠正我的错误，但是您似乎希望在单击pport按钮（或其他任何内容）时交替淡入和淡出.p01和.p02。在这种情况下，尝试第二个代码 –

，这是一个非常简单的例子。在我的实际代码中，我将有10个按钮。当一个人被点击时，它会关闭其他人。点击时也会变暗50％。当按钮被禁用时，它们会在盘旋时变暗25％。当按钮被激活时，它们会在盘旋时变暗至75％。 – Kay

我不是jQuery的专家，但我没有受过教育的眼睛问题是你的赋值立即if语句之前：

active01 = true; 
if(active01){...

当你明确设置active01标志设置为true， if将始终得到满足，所以else将永远不会运行。

来源

2015-05-06 00:33:12 slugster

试试这个：

$('#pport01').click(function(){ 
if(active01){ 
    console.log(active01 + "port1 true"); 
    $('.p01').fadeIn("slow"); 
}else{ 
    console.log(active01 + "port1 false"); 
    $('.p02').fadeOut("slow"); 
} 
active02= false; 
active01 = true; 
}

的问题是，您分配了IF之前active01和active02值，所以这是正常的active01是始终为真，并始终执行第一个IF语句第二个函数相同，在IF/ELSE后分配active01和active02

来源

2015-05-06 00:33:55 Lidia

对于此块，你的else语句将不会运行，因为布尔型active02在函数的开头声明为true。

您的第一个方块也是一样的。只有你已经颠倒了active01和active02的顺序。

$('#pport02').click(function(){ 
active01 = false; 
active02 = true; 
if(active02){ 
    console.log(active02 + "port2 true"); 
    $('.p02').fadeIn("slow"); 
}else{ 
    console.log(active02 + "port2 false"); 
    $('.p02').fadeOut("slow"); 
}

}）;

如果您尝试在active01和active02之间切换为true，请在重新分配标志之前首先运行if/else语句。

来源

2015-05-06 00:34:09

尝试类似这样的事情。

active01 === true ? $('.p01').fadeIn("slow") : $('.p02').fadeOut("slow");

来源

2015-05-06 00:35:48 user86745458

当你设置布尔active01和active02为真分别的if/else条件出现之前，你永远不会进入其他循环。

来源

2015-05-06 00:36:09 kenyiu

我相信你正在努力做到这一点：

$('#pport01').click(function(){ 
    $('.p01').fadeIn("slow"); 
    $('.p02').fadeOut("slow"); 

}); 

$('#pport02').click(function(){ 
    $('.p02').fadeIn("slow"); 
    $('.p01').fadeOut("slow"); 

});

来源

2015-05-06 00:37:28 Raghuveer

If/Else Statement does not run the else

回答

相关问题