Javascript 更改 HTML 复选框选中属性
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/7922071/
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
Change HTML checkbox checked attribute
提问by Lahey
Is it possible to change the "checked" attribute of a checkbox? So I want to change the preselect value in the HTML. (So that I can get it later with innerHTML of JavaScript).
是否可以更改复选框的“已选中”属性?所以我想更改 HTML 中的预选值。(以便我以后可以使用 JavaScript 的 innerHTML 获取它)。
回答by mikato
Sure, if you're going to use innerHTML in Javascript you could just reload the whole checkbox bit and make it checked or not. However the easier way to do it is to just change the checked attribute within Javascript if you're going to use JS anyway.
当然,如果您打算在 Javascript 中使用 innerHTML,您可以重新加载整个复选框位并使其选中或不选中。但是,如果您无论如何都打算使用 JS,那么更简单的方法是更改 Javascript 中的 checked 属性。
document.getElementById("myCheckboxId").checked = true;
EDIT
编辑
Ok, so you need to be able to get it again with innerHTML in the future. Like I said in my first sentence, you could just use innerHTML to change the checkbox as well. May be a bit hackish but could be fine if you're doing it already.
好的,所以您将来需要能够使用 innerHTML 再次获取它。就像我在第一句话中所说的那样,您也可以使用 innerHTML 来更改复选框。可能有点hackish,但如果你已经在做的话可能没问题。
Here's a test html page with links to check/uncheck via JS, check/uncheck by swapping out the whole checkbox with innerHTML, and to get innerHTML for testing. When you do the innerHTML swap, it actually changes what's returned by innerHTML later. Is this what you mean? Note: hmm I didn't realize it until now but it appears that firefox is changing my checkedto checked="checked", interesting. So the view innerHTML link shows me checked="checked"and when unchecked shows nothing. Firebug shows it change also, but slightly differently - going from checked=""to nothing.
这是一个测试 html 页面,其中包含通过 JS 选中/取消选中的链接,通过用 innerHTML 替换整个复选框来选中/取消选中,以及获取用于测试的 innerHTML。当您执行innerHTML 交换时,它实际上会更改稍后innerHTML 返回的内容。你是这个意思吗?注意:嗯,直到现在我才意识到这一点,但似乎 Firefox 正在将我的检查更改为检查 =“检查”,有趣。因此,视图innerHTML 链接向我显示已选中=“已选中”,而未选中时则不显示任何内容。Firebug 显示它也发生了变化,但略有不同——从checked=""变为没有。
<span id="testdiv1"><input type="checkbox" name="heyhey" id="heyhey" CHECKED></span>
<p>
<a href="#" onClick="document.getElementById('heyhey').checked = false;">uncheck via JS</a><br>
<a href="#" onClick="document.getElementById('heyhey').checked = true;">check via JS</a><br>
<a href="#" onClick="document.getElementById('testdiv1').innerHTML = '<input type=\'checkbox\' name=\'heyhey\' id=\'heyhey\' >';">uncheck via innerHTML swap</a><br>
<a href="#" onClick="document.getElementById('testdiv1').innerHTML = '<input type=\'checkbox\' name=\'heyhey\' id=\'heyhey\' checked>';">check via innerHTML swap</a><br>
<a href="#" onClick="alert('innerHTML!: '+'\n\n'+getElementById('testdiv1').innerHTML)">view innerHTML</a>
</p>
I don't know if I escaped all those properly but works for me. Best to not do it inline.
我不知道我是否正确地逃脱了所有这些,但对我有用。最好不要内联。
回答by Tim Down
Sounds like you have a legitimate use for setAttribute()
rather than the equivalent property (checked
). Assuming you have a checkbox stored in a variable called checkbox
, you can use the following to set the checked attribute to be checked by default:
听起来您有合法用途 forsetAttribute()
而不是等效的属性 ( checked
)。假设您有一个复选框存储在一个名为 的变量中checkbox
,您可以使用以下命令将选中的属性设置为默认选中:
checkbox.setAttribute("checked", "checked");
... and the following to remove the attribute and make the checkbox unchecked by default:
...以及以下删除属性并默认取消选中复选框的内容:
checkbox.removeAttribute("checked");
Note that this won't work properly on older IE, which has broken implementations of attribute-related methods.
请注意,这在旧版 IE 上无法正常工作,因为旧版 IE 已破坏了与属性相关的方法的实现。
I've written about this in more detail in an answer to previous question: Add attribute 'checked' on click jquery
我在上一个问题的回答中更详细地写了这个:在单击 jquery 时添加属性“已检查”
回答by Doug Chamberlain
Yes it is possible
对的,这是可能的
checkboxObject.checked=true|false
checkboxObject.checked=true|false