JQuery限制复选框checkbox可选中个数的方法


Posted in Javascript onApril 20, 2015

本文实例讲述了JQuery限制复选框checkbox可选中个数的方法。分享给大家供大家参考。具体分析如下:

由于项目需要限制可批量操作的文件个数 所以写了一段小代码
如果选中个数大于允许的最大个数 其他复选框不能选择
如果小于则所有复选框都能选择

<script type="text/javascript">
 $(document).ready(function() {
  $('input[type=checkbox]').click(function() {
   $("input[name='apk[]']").attr('disabled', true);
   if ($("input[name='apk[]']:checked").length >= 3) {
    $("input[name='apk[]']:checked").attr('disabled', false);
   } else {
    $("input[name='apk[]']").attr('disabled', false);
   }
  });
 })
</script>
<ul>
 <li>
  <input type="checkbox" name="apk[]" value=1 />
  APK1
 </li>
 <li>
  <input type="checkbox" name="apk[]" value=2 />
  APK2
 </li>
 <li>
  <input type="checkbox" name="apk[]" value=1 />
  APK3
 </li>
 <li>
  <input type="checkbox" name="apk[]" value=4 />
  APK4
 </li>
 <li>
  <input type="checkbox" name="apk[]" value=6 />
  APK5
 </li>
 <li>
  <input type="checkbox" name="apk[]" value=7 />
  APK6
 </li>
 <li>
  <input type="checkbox" name="apk[]" value=8 />
  APK7
 </li>
</ul>

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
js实现ASP分页函数 HTML分页函数
Sep 22 Javascript
jquery的ajax简单结构示例代码
Feb 17 Javascript
jQuery 回车事件enter使用示例
Feb 18 Javascript
网页广告中JS代码的信息监听示例
Apr 02 Javascript
javascript闭包入门示例
Apr 30 Javascript
AngularJS入门教程之ng-checked 指令详解
Aug 01 Javascript
vue表单绑定实现多选框和下拉列表的实例
Aug 12 Javascript
详解小程序缓存插件(mrc)
Aug 17 Javascript
js核心基础之构造函数constructor用法实例分析
May 11 Javascript
JS中call()和apply()的功能及用法实例分析
Jun 28 Javascript
小程序如何支持使用 async/await详解
Sep 12 Javascript
js中Object.create实例用法详解
Oct 05 Javascript
js插件YprogressBar实现漂亮的进度条效果
Apr 20 #Javascript
浅谈javascript中call()、apply()、bind()的用法
Apr 20 #Javascript
javascript中callee与caller的区别分析
Apr 20 #Javascript
javascript正则表达式中的replace方法详解
Apr 20 #Javascript
javascript正则表达式基础知识入门
Apr 20 #Javascript
javascript实现表单提交后,提交按钮不可用的方法
Apr 18 #Javascript
Javascript实现颜色rgb与16进制转换的方法
Apr 18 #Javascript
You might like
PHP 读取文件内容代码(txt,js等)
2009/12/06 PHP
php curl常见错误:SSL错误、bool(false)
2011/12/28 PHP
php 读取文件头判断文件类型的实现代码
2013/08/05 PHP
Yii2 GridView实现列表页直接修改数据的方法
2016/05/16 PHP
jquery隐藏标签和显示标签的实例
2013/11/11 Javascript
js原型继承的两种方法对比介绍
2014/03/30 Javascript
给angular加上动画效遇到的问题总结
2016/02/17 Javascript
基于javascript制作微信聊天面板
2020/08/09 Javascript
AngularJS 输入验证详解及实例代码
2016/07/28 Javascript
vue2.0中goods选购栏滚动算法的实现代码
2017/05/17 Javascript
security.js实现的RSA加密功能示例
2018/06/06 Javascript
JS使用tween.js动画库实现轮播图并且有切换功能
2018/07/17 Javascript
AngularJs返回前一页面时刷新一次前面页面的方法
2018/10/09 Javascript
JavaScript实现的弹出遮罩层特效经典示例【基于jQuery】
2019/07/10 jQuery
微信小程序 组件的外部样式externalClasses使用详解
2019/09/06 Javascript
微信小程序 select 下拉框组件功能
2019/09/09 Javascript
原生JS实现贪吃蛇小游戏
2020/03/09 Javascript
vue3.0自定义指令(drectives)知识点总结
2020/12/27 Vue.js
[01:05:07]DOTA2-DPC中国联赛 正赛 DLG vs Dragon BO3 第一场2月1日
2021/03/11 DOTA
python实现红包裂变算法
2016/02/16 Python
使用Python简单的实现树莓派的WEB控制
2016/02/18 Python
Python中表达式x += y和x = x+y 的区别详解
2017/06/20 Python
Python 新建文件夹与复制文件夹内所有内容的方法
2018/10/27 Python
Python实现结构体代码实例
2020/02/10 Python
整理HTML5的一些新特性与Canvas的常用属性
2016/01/29 HTML / CSS
英国游戏机和游戏购物网站:365games.co.uk
2018/06/18 全球购物
护理专业优质毕业生自荐书
2014/01/31 职场文书
校园安全广播稿
2014/02/08 职场文书
幼儿园门卫岗位职责
2014/02/14 职场文书
社区文艺活动方案
2014/08/19 职场文书
甜品蛋糕店创业计划书
2014/09/21 职场文书
合同权益转让协议书模板
2014/11/18 职场文书
先进党员事迹材料
2014/12/24 职场文书
丧事答谢词大全
2015/09/30 职场文书
Logback 使用TurboFilter实现日志级别等内容的动态修改操作
2021/08/30 Java/Android
Three.js实现雪糕地球的使用示例详解
2022/07/07 Javascript