JavaScript 复选框 onclick 函数
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/22048057/
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
JavaScript checkbox onclick function
提问by mpavlovic89
I am stuck at the simple JavaScript function, related to the checkbox validation. I need to document.write if the cb1 is checked, and the same if cb2. And if both, or one of them isn't checked, then write nothing.
我被困在与复选框验证相关的简单 JavaScript 函数上。如果cb1被选中，我需要document.write，如果cb2也一样。如果两者或其中之一未选中，则什么也不写。
<html>
<head>
<title>TEST PAGE</title>
<script type="text/javascript" src="submit.js"></script>
</head>
<body>
<div style="width:100%"><input type="checkbox" id="cb1"></div>
<div style="width:100%"><input type="checkbox" id="cb2"></div>
<div style="width:100%"><input type="submit" name="execute" id="execute" value="Execute" onClick="run();"></div>
</body>
</html>
submit.js
提交.js
function run() {
document.write('<div>' + "HERE GOES YOUR CHECKBOX CHOICE: " + '</div>');
if(document.getElementById("cb1").checked == true) {
document.write("This is check box 1");
}
if(document.getElementById("cb2").checked == true) {
document.write("This is check box 2");
}
}
回答by audiochick
Here is an improved run function:
这是一个改进的运行函数：
function run() {
var snip = "<div>HERE GOES YOUR CHECKBOX CHOICE: </div>";
if(document.getElementById("cb1").checked == true) {
snip += "<br/>This is check box 1";
}
if(document.getElementById("cb2").checked == true) {
snip += "This is check box 2";
}
document.write(snip);
}
Everyone spotted the error of overwriting you html before actually reading the elements, so that was the cause of your error, clearing the DOM and then trying to read an input property that no longer exists.
每个人都在实际读取元素之前发现了覆盖你的 html 的错误，所以这就是你的错误的原因，清除 DOM 然后尝试读取不再存在的输入属性。
回答by Anoop Joshi
you shouldnt use document.write. use append to tags like
你不应该使用 document.write。使用附加到标签，如
$("#divid").append($("<input/>",{type:"checkbox",onclick:"yourfunction(this)"}));
回答by shyamnathan
just use .checkedin javascript in jquery use .prop('checked')
只.checked在 javascript 中使用 jquery 使用.prop('checked')
function run() {
if(document.getElementById("cb1").checked) {
document.write("<div>This is check box 1</div>");
}
if(document.getElementById("cb2").checked) {
document.write("<div>This is check box 2</div>");
}
}
回答by Bic
if (document.getElementById('cb1').checked && document.getElementById('cb2').checked) {
// both are checked
}
else {
// only one or none are checked
}
As was mentioned in one of the previous answers, you should not use document.write. You can use .append(string)to add things to the document:
正如之前的一个答案中提到的，您不应该使用document.write. 您可以使用.append(string)向文档添加内容：
document.append('Both boxes are checked');
