Question

如何在单击一个复选框时单击复选框，而取消选中其他复选框。当单击复选框1时，应将其标记为选中，当单击复选框2时，应将其标记为已选中，并且应将其全部标记为未选中。

我的代码如下：

<div class="feedback-quest3">
    <label class="checkbox ques3" for="ques3-cbox1">
        <input type="checkbox" value="" id="ques3-cbox1" data-toggle="checkbox">
        1-2 
    </label>
    <label class="checkbox ques3" for="ques3-cbox2">
        <input type="checkbox" value="" id="ques3-cbox2" data-toggle="checkbox">
        2-3 
    </label>
    <label class="checkbox ques3" for="ques3-cbox3">
        <input type="checkbox" value="" id="ques3-cbox3" data-toggle="checkbox">
        3-4 
    </label>
</div>

Answer 1

请参阅 DEMO

的Javascript

function attach(element,listener,ev,tf){    
  if(element.attachEvent)    
      element.attachEvent("on"+listener,ev);    
  else    
    element.addEventListener(listener,ev,tf);
}

var parent = document.getElementById('parentElement');
var checkboxes = parent.getElementsByTagName('input');

if(checkboxes.length>0){        
    for(var i=0;i<checkboxes.length;i++){            
       attach(checkboxes[i],'click',function(event){        
          var evt = event || window.event;
          var target = evt.target || evt.srcElement;       
          for(var y=0;y<checkboxes.length;y++){             
            checkboxes[y].checked = false;                   
          }    
          target.checked = true;        
       }, false);            
    }
}

Answer 2

$(".feedback-quest3 :checkbox").on("change", function(){
  $(".feedback-quest3 :checkbox").not($(this)).prop("checked",false);
});

Answer 3

然后，试试这个：

$(".feedback-quest3 :checkbox").each(function(){
  $(".feedback-quest3 :checkbox").on("change",function(){
     $(".feedback-quest3 :checkbox").prop("checked",false);
     $(this).prop("checked",true);
  });
});

如何一次选中一个复选框，并在单击另一个复选框时将选中的复选框切换为未选中状态？

3 个答案:

的Javascript