正文

JQuery 多个checkbox 只选中一个

IP云
IP云V管理员/6 阅读
08/24
提示：扫一扫查出行
【扫一扫了解最新限行尾号】
复制提示

  1. <form id="common-form">
  2. <input name="check1" type="checkbox"/>check1
  3. <input name="check2" type="checkbox"/>check2
  4. <input name="check3" type="checkbox"/>check3
  5. </form>

  1. $(function() {
  2.   $('#common-form').find('input[type=checkbox]').bind('click', function(){  
  3.           var id = $(this).attr("id");
  4.         
  5.         //当前的checkbox是否选中
  6.         if(this.checked){
  7.             //除当前的checkbox其他的都不选中
  8.             $("#common-form").find('input[type=checkbox]').not(this).attr("checked", false);
  9.             
  10.             //选中的checkbox数量
  11.             var selectleng = $("input[type='checkbox']:checked").length;
  12.             console.log("选中的checkbox数量"+selectleng);
  13.         }else{
  14.             //未选中的处理
  15.             console.log("未选中的处理");
  16.         }
  17.     });
  18. })

如果已经有click事件相关方法，并且原有的逻辑不好修改，那么更加简单的方式是：
当创建表单时，如果您想让用户从列表中选择若干个选项时，input标签的type属性请使用 checkbox。如果您限制用户只能选择一个选项，请使用 radio。