如何选择并单击所有html复选框？

我希望选择并单击网页中的所有复选框。 我试过了：

document.querySelectorAll('button[role="checkbox"]').forEach((e)=>{ e.click(); }); 

也：

 document.querySelectorAll('[aria-checked="false"]').forEach((e)=>{ e.click(); }); 

什么都没发生，devtool控制台输出“未定义”。

要重现，您需要拥有一个已删除邮件的Hotmail电子邮件帐户。

在hotmail.com中转到“已删除项目”，在那里“恢复已删除的项目”，然后将打开一个窗口，其中包含已删除的对话。 在每个对话附近都会有一个复选框。

Answer 1

你走在正确的轨道上，但遗漏了一些细节。 首先，查询选择器function起作用。 寻找元素是他们的面包和黄油。 如果您未定义，则选择器字符串不正确。 您的HTML是否使用 ？

其次，不要使用.click() 。 这可能有用，但后续/维护程序员的工作和认知工作更多。 它还可能触发点击事件（除非你当然也喜欢这样）。 只需设置checked属性：

 document.querySelectorAll('input[type="checkbox"]').forEach( (e) => e.setAttribute('checked', '') ); 

Answer 2

如果您的复选框是inputs您可以使用…

 $('input:checkbox').prop('checked',true); 

… 要么…

 $('input[type="checkbox"]').prop('checked',true); 

Answer 3

也许不是模拟点击，尝试手动设置aria-checked属性：

 document.querySelectorAll('[role="checkbox"]').forEach((e)=>{ //e.click(); e.setAttribute("aria-checked", "true") }); 

看到这里： jsFiddle

Answer 4

尝试以下代码

 $("input[type='checkbox']").change(function(){ console.log($(this).attr("id")+" changed"); }); $(document).ready(function(){ $("input[type='checkbox']").prop("checked",true); });