.checked選項不工作我的javascript

我：.checked選項不工作我的javascript

<input type="checkbox" id="showdiv">SHOW ME! 

<div id="hello" style="display:none"> 
    Hello world! 
</div> 

<script type="text/javascript"> 
    document.getElementById("showdiv").checked ? document.getElementById("hello").style.display = "inline" : document.getElementById("hello").style.display = "none"; 
</script>

哪裏是錯誤？ div不會在點擊時顯示...

來源

2013-04-22 user2120569

什麼是你想在這裏做 – 2013-04-22 13:05:28

是你要選中該複選框，或者試圖設置顯示財產 – 2013-04-22 13:05:55

顯示隱藏的分區，如果複選框被選中 – user2120569 2013-04-22 13:06:03

添加點擊事件的代碼在哪裏？瀏覽器不會理解爲應該運行onclick

(function() { 
    var cb = document.getElementById("showdiv"); 
    cb.onclick = function() { //would be better to add it with addEventListener 
     document.getElementById("hello").style.display = cb.checked ? "block" : 'none'; 
    } 
})();

來源

2013-04-22 13:05:55 epascarello

您應該將腳本包裝到複選框的onclick函數中。

事情是這樣的：

document.getElementById("showdiv").onclick = function() { 
    document.getElementById("showdiv").checked ? document.getElementById("hello").style.display = "inline" : ''; 
};

來源

2013-04-22 13:05:57

應該

document.getElementById("showdiv").onclick = function(){ 
    document.getElementById("hello").style.display = this.checked ? 'inline' : 'none' 
}

演示：Fiddle

來源

2013-04-22 13:06:45

您需要附加一個event-listener的元素，觸發你的代碼時，該複選框點擊。就像現在一樣，您的代碼會立即執行，並且此時不會選中複選框。

document.getElementById("showdiv").addEventListener("click", callback, false); 

function callback() { 
    if (document.getElementById("showdiv").checked) 
     document.getElementById("hello").style.display = "inline"; 
}

DEMO

注意addEventListener不是由IE之前IE9支持，所以對於傳統的瀏覽器，你需要一個變通用於連接事件偵聽器。（在上面提到的文章中介紹）

來源

2013-04-22 13:07:33

試試這個，測試使用Fiddler

document.getElementById("showdiv").addEventListener("click", callback, false); 

function callback() { 
document.getElementById("showdiv").checked ? document.getElementById("hello").style.display = "inline" : document.getElementById("hello").style.display = "none"; 
}

Demo

來源

2013-04-22 13:11:27 Amit

.checked選項不工作我的javascript

回答

相關問題