.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

回答

相关问题