45

这是 HTML 代码：

<div class="text">
   <input value="true" type="checkbox" checked="" name="copyNewAddrToBilling"><label>

我想将值更改为 false。或者只是取消选中该复选框。我想在纯 JavaScript 中执行此操作，而不使用外部库（没有 jQuery 等）

4

5 回答 5

69 
<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>

我已将语言属性添加到脚本元素，但这是不必要的，因为所有浏览器都将其用作默认值，但毫无疑问，此示例显示的是什么。

如果您想使用 javascript 访问元素，它的 GetElement* 函数集非常有限。所以你需要养成给每个元素一个唯一的 id 属性的习惯。

于 2013-09-18T01:02:00.190 回答
12

推荐，没有 jQuery：

提供您<input>的 ID 并参考。此外，如果您希望复选框开始时未选中，请删除标签的checked=""一部分。<input>然后是：

document.getElementById("my-checkbox").checked = true;

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

  }
}

纯 Javascript，没有元素 ID (#2)：

document.querySelectorAll('.text input[name="copyNewAddrToBilling"]')[0].checked = true;

document.querySelector('.text input[name="copyNewAddrToBilling"]').checked = true;

请注意，这些浏览器支持querySelectorAll和querySelector方法：IE8+、Chrome 4+、Safari 3.1+、Firefox 3.5+ 和所有移动浏览器。

如果元素可能丢失，您应该测试它的存在，例如：

var input = document.querySelector('.text input[name="copyNewAddrToBilling"]');
if (!input) { return; }

使用 jQuery：

$('.text input[name="copyNewAddrToBilling"]').prop('checked', true);
于 2013-09-18T01:01:11.073 回答
5

还有另一种方法可以做到这一点：

//elem - get the checkbox element and then
elem.setAttribute('checked', 'checked'); //check
elem.removeAttribute('checked'); //uncheck
于 2016-07-08T11:46:09.500 回答
1

您需要为复选框分配一个 ID： 

<input id="checkboxId" type="checkbox" checked="" name="copyNewAddrToBilling">

然后在 JavaScript 中： 

document.getElementById("checkboxId").checked = false;
于 2013-09-18T01:05:56.297 回答
-1 
<html>
    <body>
        <input id="mycheck" type="checkbox">
    </body>

    <script language="javascript">
        var=check;
        document.getElementById("mycheck");
        check.checked="false";
    </script>
</html>
于 2020-12-18T15:49:19.383 回答