「jQuery入門」propでチェックボックスを全選択、全解除する

2017年11月27日

1.htmlコード
<div class="cftAll">
<input type="checkbox" id="cftAllPA"><label for="cftAllPA">全選択・全解除</label>
</div>
<div>
<input type="checkbox" id="chkAA"><label for="chkAA">項目PA</label>
<input type="checkbox" id="chkBB"><label for="chkBB">項目PB</label>
</div>

2.JSコード
$('.cftAll input,.cftAll label’).click(function(){
var elements = $(this).closest('.cftAll’).next().find('input’);
if($(this).is(':checked’)) {
$(elements).prop('checked’, true);
} else {
$(elements).prop('checked’, false);
}
});