How do I turn off input type=radio?

When you click on input type=radio, it turns on, but when you click on the same input again, nothing happens, is there any way to make it turn off when you click it again? First of all, it would be desirable if this could be done either through an attribute in html or in css, but if there are no such options, then there is already a sample code in js.

Author: Alex, 2020-02-14

2 answers

The first option:

    var check1,check2;
    function radioClick(c) {
        if (check1 != c) {
            check2 = 0;
            check1 = c
        }
        check2 ^= 1;
        c.checked = check2
    }
<input type="radio" name="radio" value="1" onclick="radioClick(this)"/>
<input type="radio" name="radio" value="2" onclick="radioClick(this)"/>

Second option:

    function clickRadio(param) {
        var value = document.querySelectorAll("input[type='radio'][name='" + param.name + "']");
        for (var i = 0; i < value.length; i++) {
            if (value[i] != param)
                value[i].BeforeCheck = false;
        }

        if (param.BeforeCheck)
            param.checked = false;
        param.BeforeCheck = param.checked;
    }
<label>Первый radio<input type="radio" onclick="clickRadio(this)" name="radio" /></label>
<label>Второй radio<input type="radio" onclick="clickRadio(this)" name="radio" /></label>
 3
Author: Denis640Kb, 2020-02-14 19:30:28

const checks = document.querySelectorAll('.check');
checks.forEach(function(ch) {
  ch.addEventListener('click', function() {
    var that = this;
    checks.forEach(function(ch2) {
      if (ch2 != that)
        ch2.checked = false;
    });
  });
});
<label>
  <input type="checkbox" class="check"/>
  Check1
</label><br/>
<label>
  <input type="checkbox" class="check"/>
  Check2
</label><br/>
<label>
  <input type="checkbox" class="check"/>
  Check3
</label><br/>
 1
Author: Anton Shchyrov, 2020-02-14 19:26:27