Как включить все флажки?

Question

Я пытаюсь выяснить, как вызвать кнопку ссылки для запуска и изменения всех флажков, которые нужно проверить при нажатии. Когда я нажимаю кнопку, он выдает предупреждающее сообщение, но не вызывает эти флажки. Я пробовал некоторые ответы, перечисленные на этом сайте, но это не работает. Я воссоздал проблему с 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")); 
}); 

Answer 1

Проблема в том, что this будет ссылаться на a элемент и объект JQuery, содержащий этот элемент не имеет checked свойство. Вместо этого просто установите его в true:

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

Updated fiddle