虚假陈述未由三元运算符执行

Question

在以下代码中，如果条件返回false，则三元运算符不会分配值！

<script> 
       function lgn() { 
        document.getElementById('overlay').style.display = 'none' ? 'block':'none'; 
        document.getElementById('lgn').style.display = 'none' ? 'block':'none'; 
       } 
</script> 

其实我试图让我在网页上的覆盖，以下是嫩枝：

<div class="nvg"> 
       <ul> 
        {% block links %} 
        <li class="n.link"><span class="fa fa-times close" onclick="lgn()"></span></li> 
        {% endblock %} 
       </ul> 
</div> 

和

{% block overlay %} 
     {{ form_start(form, {'attr':{'id':'lgn'}}) }} 
     <span class="fa fa-times close" onclick="lgn()"></span><br /> 
     <span>Login:</span> 
     {{ form_widget(form.email, {'attr':{'placeholder':'email'}}) }} 
     {{ form_widget(form.pass, {'attr':{'placeholder':'password','class':'pass'}}) }} 
     {{ form_end(form) }} 
{% endblock %} 

请帮助...

Answer 1

你的三元没有意义。

document.getElementById('overlay').style.display = 'none' ? 'block':'none'; 

没有合乎逻辑的评估，字符串将（大部分）总是被评估为true。做这样的事情：

document.getElementById('overlay').style.display = (document.getElementById('overlay').style.display == 'none') ? 'block' : 'none'; 

你最好的解决方案（在清洁方面）是使选择器变成变量。

function lgn() { 
    element1 = document.getElementById('overlay'); 
    element1.style.display = (element1.style.display == 'none') ? 'block' : 'none'; 

    element2 = document.getElementById('lgn'); 
    element2.style.display = (element2.style.display == 'none') ? 'block' : 'none'; 
} 

Answer 2

三元使一个布尔值决定，而你写你永远评估为true：

'none' ? 'block':'none'; 

是基本相同

if ('none' is true) { 
    'block' 
} else { 
    'none'; 
} 

由于none作为一个字符串是一个真理（在大多数情况下，其结果与布尔真正一样），你总是选择三元组中的“真实”路径。

Answer 3

您总是分配display到'block'因为'none'是一个非空串，这是总是真正

document.getElementById('overlay').style.display = 'none' ? 'block':'none'; 

此语句

var display = document.getElementById('overlay').style.display 
document.getElementById('overlay').style.display = display == 'none' ? 'block':'none';