[jQuery]checkboxによる一括チェックと一括解除サンプル

jQuery

2018.11.042021.03.11

jQuery
HTML
デモ

jQuery

<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script>
$(function(){
	$('input[name=check_all]').on('change', function() {
		$('input.check').prop('checked', this.checked);
	});
});
</script>

$(function(){

$('input[name=check_all]').on('change', function() {

$('input.check').prop('checked', this.checked);

});

</script>

HTML

<ul>
	<li>
		<input type="checkbox" name="check_all" class="allcheck" id="check_all">
		<label for="check_all">一括選択・解除</label>
	</li>
	<li>
		<input type="checkbox" name="check_a" id="check_a" class="check">
		<label for="check_a">A</label>
	</li>
	<li>
		<input type="checkbox" name="check_b" id="check_b" class="check">
		<label for="check_b">B</label>
	</li>
	<li>
		<input type="checkbox" name="check_c" id="check_c" class="check">
		<label for="check_c">C</label>
	</li>
	<li>
		<input type="checkbox" name="check_d" id="check_d" class="check">
		<label for="check_d">D</label>
	</li>
</ul>