javascript使用shift+click实现选择和反选checkbox的方法


Posted in Javascript onMay 04, 2015

本文实例讲述了javascript使用shift+click实现选择和反选checkbox的方法。分享给大家供大家参考。具体实现方法如下:

var lastChecked = null;
var handleChecked = function(e) {
 if(lastChecked && e.shiftKey) {
  var i = $('input[type="checkbox"]').index(lastChecked);
 var j = $('input[type="checkbox"]').index(e.target);
 var checkboxes = [];
 if (j > i) {
  checkboxes = $('input[type="checkbox"]:gt('+ (i-1) +'):lt('+(j-i)+')');
 } else {
  checkboxes = $('input[type="checkbox"]:gt('+ j +'):lt('+ (i-j) +')');
 }
 if (!$(e.target).is(':checked')) {
  $(checkboxes).removeAttr('checked');
 } else {
  $(checkboxes).attr('checked', 'checked');
 }
 }
 lastChecked = e.target;
 // Other click action code.
}
$('input[type=checkbox]').click(handleChecked);

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

Javascript 相关文章推荐
javascript实现的像java、c#之类的sleep暂停的函数代码
Mar 04 Javascript
通过Javascript读取本地Excel文件内容的代码示例
Apr 08 Javascript
node.js中的buffer.length方法使用说明
Dec 14 Javascript
jQuery EasyUI之DataGrid使用实例详解
Jan 04 Javascript
js获取所有checkbox的值的简单实例
May 30 Javascript
微信小程序实现瀑布流布局与无限加载的方法详解
May 12 Javascript
浅谈vue+webpack项目调试方法步骤
Sep 11 Javascript
layui之select的option叠加问题的解决方法
Mar 08 Javascript
vue 实现左右拖拽元素并且不超过他的父元素的宽度
Nov 30 Javascript
vue.js使用v-model实现表单元素(input) 双向数据绑定功能示例
Mar 08 Javascript
vue子组件改变父组件传递的prop值通过sync实现数据双向绑定(DEMO)
Feb 01 Javascript
echarts饼图各个板块之间的空隙如何实现
Dec 01 Javascript
js实现兼容IE和FF的上下层的移动
May 04 #Javascript
jQuery结合CSS制作漂亮的select下拉菜单
May 03 #Javascript
jQuery实现的向下图文信息滚动效果
May 03 #Javascript
JQuery插件Quicksand实现超炫的动画洗牌效果
May 03 #Javascript
JQuery页面地址处理插件jqURL详解
May 03 #Javascript
jQuery的animate函数实现图文切换动画效果
May 03 #Javascript
php+ajax+jquery实现点击加载更多内容
May 03 #Javascript
You might like
PHP 伪静态隐藏传递参数名的四种方法
2010/02/22 PHP
php 文件缓存函数
2011/10/08 PHP
PHP+Ajax异步通讯实现用户名邮箱验证是否已注册( 2种方法实现)
2011/12/28 PHP
详解Yii2.0 rules验证规则集合
2017/03/21 PHP
js选取多个或单个元素的实现代码(用class)
2012/08/22 Javascript
JavaScript中的匀速运动和变速(缓冲)运动详细介绍
2012/11/11 Javascript
jQuery $.data()方法使用注意细节
2012/12/31 Javascript
JS根据年月获得当月天数的实现代码
2014/07/03 Javascript
【经典源码收藏】基于jQuery的项目常见函数封装集合
2016/06/07 Javascript
使用UrlConnection实现后台模拟http请求的简单实例
2017/01/04 Javascript
JavaScript实现星级评分
2017/01/12 Javascript
js获取地址栏中传递的参数(两种方法)
2017/02/08 Javascript
canvas实现钟表效果
2017/02/13 Javascript
通过函数作用域和块级作用域看javascript的作用域链
2018/08/05 Javascript
vue 属性拦截实现双向绑定的实例代码
2018/10/24 Javascript
Vue页面切换和a链接的本质区别详解
2019/11/12 Javascript
在JavaScript中查找字符串中最长单词的三种方法(推荐)
2021/01/18 Javascript
编程语言Python的发展史
2014/09/26 Python
python实现爬虫统计学校BBS男女比例(一)
2015/12/31 Python
Python编程实现双击更新所有已安装python模块的方法
2017/06/05 Python
速记Python布尔值
2017/11/09 Python
Python 类的特殊成员解析
2018/06/20 Python
python+pyqt5实现KFC点餐收银系统
2019/01/24 Python
Python yield的用法实例分析
2020/03/06 Python
HTML5+JS实现俄罗斯方块原理及具体步骤
2013/11/29 HTML / CSS
怎样比较两个类型为String的字符串
2016/08/17 面试题
求职信内容考虑哪几点
2013/10/05 职场文书
机械个人求职信范文
2014/01/24 职场文书
网络信息安全承诺书
2014/03/26 职场文书
个人借款担保书
2014/04/02 职场文书
土地租赁意向书
2014/07/30 职场文书
受伤赔偿协议书
2014/09/24 职场文书
学校领导班子成员查摆问题及整改措施
2014/10/28 职场文书
2014年业务员工作总结范文
2014/11/17 职场文书
法律意见书范文
2015/06/04 职场文书
2019假期福利管理制度!
2019/07/15 职场文书