首页 > 在单选框选中的情况下,点击被选单选框取消选中状态

在单选框选中的情况下,点击被选单选框取消选中状态

如何用jq实现在单选框选中的情况下,点击选中状态的单选框,可以取消该单选框的选中状态?



    var clicks = document.querySelectorAll(".canClick"),
        len = clicks.length;
    for (var i = 0; i < len; i++) {
        clicks[i].onclick = function (num) {
            var index = 1;
            return function () {
                if (index++ % 2 !== 0) {
                    $("#target" + (num + 1)).prop("checked", true); 
                } else {
                    $("#target" + (num + 1)).prop("checked", false); 
                }
            }
        }(i);
    }

具体代码已经有人贴了,这里我还想多说一句:非常不建议修改原生控件的交互方式,这样会带给用户困惑。
如果你有这样的需求,仔细考虑下是不是选错了控件,或者说应该额外添加一个单选框表示一个默认(用户未选择)的状态


var radioclick=1;
$("#radio").click(function(){
    if(radioclick%2==0){
        $(this).prop("checked",false);
    }
    radioclick++;
});

<label for="J_radio">
  <input type="radio" name="name" id="J_radio" value="1" checked="checked">
  单选框
</label>
<script type="text/javascript">
$(function(){
  $('#J_radio').on('click', function(){
    var ischecked = $(this).data('checked');
    if (!ischecked && this.checked) {
      $(this).data('checked', true);
    }else{
      $(this).prop('checked', false);
      $(this).data('checked', false);
    }
    console.log($(this).data('checked'))
  }).data('checked', $('#J_radio').get(0).checked);
})
</script>
【热门文章】
【热门文章】