虛假陳述未由三元運算符執行

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';