如何触发检查所有复选框?

时间:2016-04-19 13:50:09

标签: javascript jquery checkbox onclick jquery-selectors

我正在试图弄清楚如何触发链接按钮来触发并更改所有复选框,以便在点击时进行检查。当我单击按钮时,它将显示警告消息,但不会触发复选框。我已尝试在此网站中列出的一些答案,但它不起作用。我用jsfiddle重新创建了问题。

HTML:

<h3><a href="javascript:void(0);" id="checkAll">Check</a> All</h3>
<hr/>
<input class="categories" type="checkbox" name="filter" value="Math" checked>Math<br/>
<input class="categories" type="checkbox" name="filter" value="Science" checked>Science<br/>
<input class="categories" type="checkbox" name="filter" value="Reading" checked>Reading

JS:

$('#checkAll').click(function()
{
  alert("checkAll was clicked!");
  console.log("Checkboxes has been refilled!");
  $(':checkbox.categories').prop('checked', $(this).checked); // re-check all checkboxes
  //$("input:checkbox").prop('checked', $(this).prop("checked"));
});

1 个答案:

答案 0 :(得分:6)

问题是因为this将引用a元素,并且包含该元素的jQuery对象没有checked属性。相反,只需将其设置为true

$('#checkAll').click(function(e) {
  e.preventDefault();
  $(':checkbox.categories').prop('checked', true);
});

Updated fiddle