「JQuery入門」全てにチェックを実装するサンプル

2018年12月12日

1.htmlコード

<p><input type="checkbox" name="cft" value="cft" id="cft">全てにチェック</p>
<p><input type="checkbox" name="city[]" value="oosaka">大阪</p>
<p><input type="checkbox" name="city[]" value="tokyo">東京</p>
<p><input type="checkbox" name="city[]" value="fukuoka">福岡</p>

2.JSコード

  $('#cft').change(function() {
    if ($(this).prop('checked')) {
      // チェックを入れる
      $('input[name="city[]"]').prop('checked', true);
    } else {
      // チェックを外す
      $('input[name="city[]"]').prop('checked', false);
    }
  });