如何使用 JavaScript 选中/取消选中复选框?
使用 JavaScript 选中/取消选中复选框
IT技术
javascript
checkbox
2021-01-24 04:03:18
6个回答
Javascript:
// Check
document.getElementById("checkbox").checked = true;
// Uncheck
document.getElementById("checkbox").checked = false;
jQuery (1.6+):
// Check
$("#checkbox").prop("checked", true);
// Uncheck
$("#checkbox").prop("checked", false);
jQuery (1.5-):
// Check
$("#checkbox").attr("checked", true);
// Uncheck
$("#checkbox").attr("checked", false);
尚未提及的重要行为:
以编程方式设置checked属性,不会触发change
checkbox的事件。
在这个小提琴中亲眼看看:http :
//jsfiddle.net/fjaeger/L9z9t04p/4/
(Fiddle 在 Chrome 46、Firefox 41 和 IE 11 中测试)
该click()
方法
有一天你可能会发现自己在编写代码,这依赖于被触发的事件。要确保事件触发,请调用click()
复选框元素的方法,如下所示:
document.getElementById('checkbox').click();
但是,这会切换复选框的选中状态,而不是专门将其设置为true
或false
。请记住,该change
事件只应在已检查的属性实际更改时触发。
它也适用于 jQuery 方式:使用prop
or设置属性attr
不会触发change
事件。
设置checked
为特定值
您可以checked
在调用该click()
方法之前测试该属性。例子:
function toggle(checked) {
var elm = document.getElementById('checkbox');
if (checked != elm.checked) {
elm.click();
}
}
在此处阅读有关单击方法的更多信息:https :
//developer.mozilla.org/en-US/docs/Web/API/HTMLElement/click
去检查:
document.getElementById("id-of-checkbox").checked = true;
取消选中:
document.getElementById("id-of-checkbox").checked = false;
我们可以检查一个微粒复选框,
$('id of the checkbox')[0].checked = true
并取消选中,
$('id of the checkbox')[0].checked = false
试试这个:
//Check
document.getElementById('checkbox').setAttribute('checked', 'checked');
//UnCheck
document.getElementById('chk').removeAttribute('checked');
其它你可能感兴趣的问题