【コピペ】お問い合わせフォームで、checkがある場合に送信ボタンが押せるように(disabledをとる)実装

個人情報保護方針に同意した場合にのみ、送信ボタンが押せるように実装。

下記コピペでOKです。

HTML

<input type="checkbox" name="個人情報の取扱いへの同意" value="同意する" id="consent">
<label class="checkbox" for="consent">個人情報の取り扱いに同意します</label>

<button type="submit" disabled>送信ボタン</button>

jQuery

$('input[name="個人情報の取扱いへの同意"]').change(function() {
  var prop = $('input[name="個人情報の取扱いへの同意"]').prop('checked');
  if (prop) {
    $('button').prop('disabled', false);
    $('button').addClass('active');
  } else {
    $('button').prop('disabled', true);
    $('button').removeClass('active');
  }
});

ボタンが押せるときには、activeclassがボタンにつくようになっているのでcssで調整可能です。

最新情報をチェックしよう!