Javascript 如何确定复选框是否被选中？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4754699/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How do I determine if a checkbox is checked?
提问by Sean
For some reason, my form does not want to get the value of a checkbox... I am not sure if it is my coding or not, but when I try and alert()the value, I get undefinedas a result. What do I have wrong?
出于某种原因，我的表单不想获取复选框的值......我不确定这是否是我的编码，但是当我尝试alert()获取值时，我得到undefined了结果。我有什么问题？
<head>
<script>
var lfckv = document.getElementById("lifecheck").checked
function exefunction(){
alert(lfckv);
}
</script>
</head>
<body>
<label><input id="lifecheck" type="checkbox" >Lives</label>
</body>
EDIT
编辑
I tried changing it to this
我试着把它改成这个
function exefunction() {
alert(document.getElementById("lifecheck").checked);
}
But now it doesn't even want to execute. What's going wrong?
但现在它甚至不想execute。怎么了？
回答by Elian Ebbing
Place the var lfckvinside the function. When that line is executed, the body isn't parsed yet and the element "lifecheck"doesn't exist. This works perfectly fine:
把var lfckv函数放在里面。执行该行时，主体尚未解析，元素"lifecheck"也不存在。这工作得很好：
function exefunction() {
var lfckv = document.getElementById("lifecheck").checked;
alert(lfckv);
}<label><input id="lifecheck" type="checkbox" >Lives</label>
<button onclick="exefunction()">Check value</button>回答by Jeff B
You are trying to read the value of your checkbox before it is loaded. The script runs before the checkbox exists. You need to call your script when the page loads:
您正在尝试在加载之前读取复选框的值。该脚本在复选框存在之前运行。您需要在页面加载时调用您的脚本：
<body onload="dosomething()">
<body onload="dosomething()">
Example:
例子：
http://jsfiddle.net/jtbowden/6dx6A/
http://jsfiddle.net/jtbowden/6dx6A/
You are also missing a semi-colon after your first assignment.
第一次分配后，您还缺少分号。
回答by rapaelec
You can use this code, it can return trueor false:
您可以使用此代码，它可以返回true或false：
$(document).ready(function(){
//add selector of your checkbox
var status=$('#IdSelector')[0].checked;
console.log(status);
});回答by Joel
The line where you define lfckv is run whenever the browser finds it. When you put it into the head of your document, the browser tries to find lifecheck id before the lifecheck element is created. You must add your script below the lifecheck input in order for your code to work.
只要浏览器找到它，你定义 lfckv 的行就会运行。当您将其放入文档的头部时，浏览器会在创建 lifecheck 元素之前尝试查找 lifecheck id。您必须在 lifecheck 输入下方添加脚本才能使您的代码正常工作。
回答by Walf
try learning jQueryit's a great place to start with javascript and it really simplifies your code and help separate your js from your html. include the js file from google's CDN (https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js)
尝试学习jQuery，这是从 javascript 开始的好地方，它确实简化了您的代码，并有助于将您的 js 与 html 分开。包括来自谷歌 CDN 的 js 文件（https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js）
then in your script tag (still in the <head>) use:
然后在您的脚本标签（仍在<head>）中使用：
$(function() {//code inside this function will run when the document is ready
alert($('#lifecheck').is(':checked'));
$('#lifecheck').change(function() {//do something when the user clicks the box
alert(this.checked);
});
});
回答by rapaelec
<!doctype html>
<html lang="en">
<head>
</head>
<body>
<label><input class="lifecheck" id="lifecheck" type="checkbox" checked >Lives</label>
<script type="application/javascript" >
lfckv = document.getElementsByClassName("lifecheck");
if (true === lfckv[0].checked) {
alert('the checkbox is checked');
}
</script>
</body>
</html>so after you can add event in javascript to have dynamical event affected with the checkbox .
因此，在您可以在 javascript 中添加事件以通过复选框影响动态事件之后。
thanks
谢谢
回答by Flavio Caduff
Following will return true when checkbox is checked and false when not.
当复选框被选中时，以下将返回 true，否则将返回 false。
$(this).is(":checked")
Replace $(this) with the variable you want to check.
将 $(this) 替换为您要检查的变量。
And used in a condition:
并在条件下使用：
if ($(this).is(":checked")) {
// do something
}
回答by rapaelec
var elementCheckBox = document.getElementById("IdOfCheckBox");
elementCheckBox[0].checked //return true if checked and false if not checkedthanks
谢谢
回答by Gautam Viradiya
<!DOCTYPE html>
<html>
<body>
<input type="checkbox" id="isSelected"/>
<div id="myDiv" style="display:none">Is Checked</div>
</body>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script>
$('#isSelected').click(function() {
$("#myDiv").toggle(this.checked);
});
</script>
</html>
