Html 如何取消选中纯 JavaScript 中的复选框？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/18862149/
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 to uncheck a checkbox in pure JavaScript?
提问by De Vonte
Here is the HTML Code:
这是 HTML 代码：
<div class="text">
<input value="true" type="checkbox" checked="" name="copyNewAddrToBilling"><label>
I want to change the value to false. Or just uncheck the checkbox. I'd like to do this in pure JavaScript, without the use of external libraries (no jQuery etc)
我想将值更改为 false。或者只是取消选中复选框。我想在纯 JavaScript 中执行此操作，而不使用外部库（没有 jQuery 等）
回答by Strings
<html>
<body>
<input id="check1" type="checkbox" checked="" name="copyNewAddrToBilling">
</body>
<script language="javascript">
document.getElementById("check1").checked = true;
document.getElementById("check1").checked = false;
</script>
</html>
I have added the language attribute to the script element, but it is unnecessary because all browsers use this as a default, but it leaves no doubt what this example is showing.
我已经将 language 属性添加到 script 元素，但这是不必要的，因为所有浏览器都使用它作为默认值，但毫无疑问，这个示例显示的是什么。
If you want to use javascript to access elements, it has a very limited set of GetElement* functions. So you are going to need to get into the habit of giving every element a UNIQUE id attribute.
如果您想使用 javascript 访问元素，它的 GetElement* 函数集非常有限。所以你需要养成给每个元素一个 UNIQUE id 属性的习惯。
回答by shennan
Recommended, without jQuery:
推荐，没有 jQuery：
Give your <input>an ID and refer to that. Also, remove the checked=""part of the <input>tag if you want the checkbox to start out unticked. Then it's:
给你<input>一个 ID 并参考那个。此外，如果您希望复选框开始时未选中，请删除标签的checked=""一部分<input>。然后是：
document.getElementById("my-checkbox").checked = true;
Pure JavaScript, with no Element ID (#1):
纯 JavaScript，没有元素 ID (#1)：
var inputs = document.getElementsByTagName('input');
for(var i = 0; i<inputs.length; i++){
if(typeof inputs[i].getAttribute === 'function' && inputs[i].getAttribute('name') === 'copyNewAddrToBilling'){
inputs[i].checked = true;
break;
}
}
Pure Javascript, with no Element ID (#2):
纯 Javascript，没有元素 ID (#2)：
document.querySelectorAll('.text input[name="copyNewAddrToBilling"]')[0].checked = true;
document.querySelector('.text input[name="copyNewAddrToBilling"]').checked = true;
Note that the querySelectorAlland querySelectormethods are supported in these browsers: IE8+, Chrome 4+, Safari 3.1+, Firefox 3.5+ and all mobile browsers.
请注意，这些浏览器支持querySelectorAll和querySelector方法：IE8+、Chrome 4+、Safari 3.1+、Firefox 3.5+ 和所有移动浏览器。
If the element may be missing, you should test for its existence, e.g.:
如果元素可能丢失，您应该测试它是否存在，例如：
var input = document.querySelector('.text input[name="copyNewAddrToBilling"]');
if (!input) { return; }
With jQuery:
使用 jQuery：
$('.text input[name="copyNewAddrToBilling"]').prop('checked', true);
回答by Yang You
There is another way to do this:
还有另一种方法可以做到这一点：
//elem - get the checkbox element and then
elem.setAttribute('checked', 'checked'); //check
elem.removeAttribute('checked'); //uncheck
回答by Oli_G
You will need to assign an ID to the checkbox:
您需要为复选框分配一个 ID：
<input id="checkboxId" type="checkbox" checked="" name="copyNewAddrToBilling">
and then in JavaScript:
然后在 JavaScript 中：
document.getElementById("checkboxId").checked = false;
