Brian Cray's Blogより、フォームで使えるチェックボックスをすべて選択させるスクリプトの紹介です。
fieldset要素にあるすべてのチェックボックスが対象です。
以下、設置例です。
HTML
<fieldset>
// these will be affected by check all
<div><input type="checkbox" id="checkall"> Check all</div>
<div><input type="checkbox"> Checkbox</div>
<div><input type="checkbox"> Checkbox</div>
<div><input type="checkbox"> Checkbox</div>
</fieldset>
<fieldset>
// these won't be affected by check all; different fieldset
<div><input type="checkbox"> Checkbox</div>
<div><input type="checkbox"> Checkbox</div>
<div><input type="checkbox"> Checkbox</div>
</fieldset>
jQuery
$(function () { // this line makes sure this code runs on page load
$('#checkall').click(function () {
$checkall = $(this); // set to variable for performance
$close = $checkall.parents('fieldset:eq(0)').find('input'); // set to variable for performance
$checkall.attr('checked') !== true ? $close.removeAttr('checked') : $close.attr('checked', 'checked');
});
});
コメント