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 相关文章推荐
prototype Element学习笔记(Element篇三)
Oct 26 Javascript
javascript入门基础之私有变量
Feb 23 Javascript
jQuery 联动日历实现代码
May 31 Javascript
给页面渲染时间加速 干掉Dom Level 0 Event
Dec 19 Javascript
浅析Javascript匿名函数与自执行函数
Feb 06 Javascript
Bootstrap表单组件教程详解
Apr 26 Javascript
bootstrap模态框远程示例代码分享
May 22 Javascript
微信小程序获取手机系统信息的方法【附源码下载】
Dec 07 Javascript
vue 实现滚动到底部翻页效果(pc端)
Jul 31 Javascript
Vue实现开心消消乐游戏算法
Oct 22 Javascript
JavaScript实现网页留言板功能
Nov 23 Javascript
Vue实现一种简单的无限循环滚动动画的示例
Jan 10 Vue.js
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
js下函数般调用正则的方法附代码
2008/06/22 PHP
PHP 读取Postgresql中的数组
2013/04/14 PHP
golang与php实现计算两个经纬度之间距离的方法
2016/07/22 PHP
php判断手机浏览还是web浏览,并执行相应的动作简单实例
2016/07/28 PHP
PHP实现的简单AES加密解密算法实例
2017/05/29 PHP
PHP检查网站是否宕机的方法示例
2017/07/24 PHP
Yii2压缩PHP中模板代码的输出问题
2018/08/28 PHP
Javascript中暂停功能的实现代码
2007/03/04 Javascript
翻译整理的jQuery使用查询手册
2007/03/07 Javascript
基于Jquery插件开发之图片放大镜效果(仿淘宝)
2011/11/19 Javascript
javascript 事件处理、鼠标拖动效果实现方法详解
2012/05/11 Javascript
多种JQuery循环滚动文字图片效果代码
2020/06/23 Javascript
JavaScript中有关一个数组中最大值和最小值及它们的下表的输出的解决办法
2016/07/01 Javascript
JavaScript 中对象的深拷贝
2016/12/04 Javascript
Javascript刷新页面的实例
2017/09/23 Javascript
Vue中的无限加载vue-infinite-loading的方法
2018/04/08 Javascript
原生js检测页面加载完毕的实例
2018/09/11 Javascript
详解Vue组件之作用域插槽
2018/11/22 Javascript
js实现删除li标签一行内容
2019/04/16 Javascript
Vue 实现CLI 3.0 + momentjs + lodash打包时优化
2019/11/13 Javascript
Python面向对象之继承代码详解
2018/01/29 Python
Python使用Windows API创建窗口示例【基于win32gui模块】
2018/05/09 Python
python3中替换python2中cmp函数的实现
2019/08/20 Python
Python 使用 Pillow 模块给图片添加文字水印的方法
2019/08/30 Python
win10环境下配置vscode python开发环境的教程详解
2019/10/16 Python
Python接口自动化系列之unittest结合ddt的使用教程详解
2021/02/23 Python
html5 利用canvas实现超级玛丽简单动画
2013/09/06 HTML / CSS
Lyle & Scott苏格兰金鹰官网:英国皇室御用品牌
2018/05/09 全球购物
美国汽车零部件和配件网站:CarParts
2019/03/13 全球购物
阿玛尼美妆英国官网:Giorgio Armani Beauty英国
2019/03/28 全球购物
一个J2EE项目团队的主要人员组成是什么
2012/06/04 面试题
实习生求职自荐信
2014/02/07 职场文书
基本公共卫生服务健康教育工作方案
2014/05/22 职场文书
店面出租协议书范本
2014/11/28 职场文书
放假通知
2015/04/14 职场文书
html输入两个数实现加减乘除功能
2021/07/01 HTML / CSS