javascript - 用label标签写了个单选按钮，可以选中该按钮，但是不能取消选中，请问怎么写取消

问题描述

问 题

html代码：
<div class="checkout-select checkout-add-y">

            <a data-toggle="collapse" data-parent="#accordion" href="#collapsejifen">
            </a>

            <ul class="y-check-top-box" id="collapsejifen">
                <!--如果剩余积分大于0-->
                {if $pay_points>0}
                <li class="dis-box ts-1-11 y-checkout-box" id="li_1" style="position:relative; bottom:15px;"><span style="position:relative; top:20px;">使用积分：<span style="font-size:14px;">您当前的可用积分为[{$pay_points}]分</span></span>
                    <div class="box-flex" style="position:relative; top:15px;">
                        <label class="ts-1-8" for="points"><i></i></label>
                    </div>

                    <input type="radio" class="radio" name="points" id="points" checked="false" onclick="changePoints()" />
                    <input type="hidden" name="pay_points" id="pay_points" value="{$pay_points}">
                    <input type="hidden" name="curr_pay_points" id="curr_pay_points" value="0">
                </li>
                 <hr style="margin-top:5px;">
            </ul>
               {/if}
        </div>

解决方案

直接判断如果选中再次点击的话 this.checked = false;

写了一大部分

  <form action="">
    <input class="radio" name="age" type="radio" value="a"/>a<br>
    <input class="radio" name="age" type="radio" value="b"/>b<br>
    <input class="radio" name="age" type="radio" value="c"/>c
  </form>

  <script>
    var radio = document.querySelectorAll('.radio');

    radio.forEach(function(r) {
      var isChecked = false

      r.addEventListener('click', function () {
        if (this.checked === true && isChecked === false) {
          isChecked = true
        } else {
          this.checked = false
          isChecked = false
        }
      })
    })
  </script>

剩下的自己写吧，没什么问题

这篇关于javascript - 用label标签写了个单选按钮，可以选中该按钮，但是不能取消选中，请问怎么写取消的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！