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

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

2017年08月12日

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

[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:二度押しで選択解除できるラジオボタン | 技術屋ネオビットの覚え書き