[jQuery]選択状態になったラジオボタンを再度クリックして選択解除するjQueryコード。

[jQuery]選択状態になったラジオボタンを再度クリックして選択解除するjQueryコード。

2017年08月12日 /最終更新:2017年08月17日

一度クリックして選択状態になったラジオボタンを、再度クリックすることによって選択状態を解除する方法です。

[jQuery]選択状態になったラジオボタンを再度クリックして選択解除するjQueryコード。

ラジオボタンは一度クリックしてしまうと同一の「name」を持つ他のラジオボタンをクリックしなければ選択が解除されません。もう一度クリックすることで選択状態が解除できるようにするには、以下のjQueryコードが良さそうです。

JS

$(function(){
  var nowchecked = $('input[name=xxxx]:checked').val();
  $('input[name=xxxx]').click(function(){
    if($(this).val() == nowchecked) {
      $(this).prop('checked', false);
      nowchecked = false;
    } else {
      nowchecked = $(this).val();
    }
  });
});

参考URL:二度押しで選択解除できるラジオボタン | 技術屋ネオビットの覚え書き