2016-04-19 7 views
2

Ich versuche herauszufinden, wie Sie eine Link-Schaltfläche auslösen und alle Kontrollkästchen aktivieren, wenn sie angeklickt werden. Wenn ich auf die Schaltfläche klicke, wird die Warnmeldung angezeigt, aber die Kontrollkästchen werden nicht ausgelöst. Ich habe einige Antworten auf dieser Website versucht, aber es funktioniert nicht. Ich habe das Problem mit einem jsfiddle neu erstellt.Wie löst man alle Checkboxen aus?

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

Antwort

6

Das Problem ist, weil this zum a Elemente beziehen und das jQuery-Objekt, das Element enthält, hat keine checked Eigenschaft. Stattdessen legt es nur true:

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

Updated fiddle

+0

Vielen Dank für die Hilfe! :) – TheAmazingKnight