使用 JavaScript 选中/取消选中复选框click（）方法设置为特定值checked

javascript checkbox

2022-08-29 22:29:55

如何使用JavaScript选中/取消选中复选框？

答案 1

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);

答案 2

尚未提及的重要行为：

以编程方式设置选中的属性，不会触发复选框的更改事件。

（在Chrome 46，Firefox 41和IE 11中测试的小提琴）

`click（）` 方法

有一天，你可能会发现自己在编写代码，这依赖于被触发的事件。若要确保事件触发，请调用 checkbox 元素的方法，如下所示：click()

document.getElementById('checkbox').click();

但是，这将切换复选框的选中状态，而不是将其专门设置为或。请记住，仅当选中的属性实际更改时，才应触发该事件。truefalsechange

它也适用于jQuery方式：使用prop或attr设置属性，不会触发change事件。

您可以在调用该方法之前测试该属性。例：checkedclick()

function toggle(checked) {
  var elm = document.getElementById('checkbox');
  if (checked != elm.checked) {
    elm.click();
  }
}