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 相关文章推荐
jQuery 获取对象 基本选择与层级
May 31 Javascript
js函数调用常用方法详解
Dec 03 Javascript
求数组最大最小值方法适用于任何数组
Aug 16 Javascript
JS增加行复制行删除行的实现代码
Nov 09 Javascript
Jquery时间轴特效(三种不同类型)
Nov 02 Javascript
AngularJS Bootstrap详细介绍及实例代码
Jul 28 Javascript
jQuery如何跳转到另一个网页 就这么简单
Dec 28 Javascript
JS实现最简单的冒泡排序算法
Feb 15 Javascript
详解Vue 动态添加模板的几种方法
Apr 25 Javascript
在vue项目中优雅的使用SVG的方法实例详解
Dec 03 Javascript
jQuery+PHP+Ajax实现动态数字统计展示功能
Dec 25 jQuery
基于Vue.js+Nuxt开发自定义弹出层组件
Oct 09 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 应用程序的安全 -- 不能违反的四条安全规则
2006/11/26 PHP
php下MYSQL limit的优化
2008/01/10 PHP
php制作unicode解码工具(unicode编码转换器)代码分享
2013/12/24 PHP
getJSON跨域SyntaxError问题分析
2014/08/07 PHP
浅谈PHP中JSON数据操作
2015/07/01 PHP
Zend Framework教程之Zend_Registry对象用法分析
2016/03/22 PHP
php校验公钥是否可用的实例方法
2019/09/17 PHP
jQuery窗口、文档、网页各种高度的精确理解
2014/07/02 Javascript
jQuery中append()方法用法实例
2014/12/25 Javascript
jQuery中closest()函数用法实例
2015/01/07 Javascript
jQuery根据name属性进行查找的用法分析
2016/06/23 Javascript
jQuery的Cookie封装,与PHP交互的简单实现
2016/10/05 Javascript
JavaScript中cookie工具函数封装的示例代码
2016/10/11 Javascript
JavaScript注入漏洞的原理及防范(详解)
2016/12/04 Javascript
JS组件系列之Gojs组件 前端图形化插件之利器
2017/11/29 Javascript
vue2.0之多页面的开发的示例
2018/01/30 Javascript
js字符串处理之绝妙的代码
2019/04/05 Javascript
js全屏事件fullscreenchange 实现全屏、退出全屏操作
2019/09/17 Javascript
javascript设计模式 ? 观察者模式原理与用法实例分析
2020/04/22 Javascript
vue登录页实现使用cookie记住7天密码功能的方法
2021/02/18 Vue.js
python使用response.read()接收json数据的实例
2018/12/19 Python
python使用turtle绘制国际象棋棋盘
2019/05/23 Python
python做接口测试的必要性
2019/11/20 Python
keras中epoch,batch,loss,val_loss用法说明
2020/07/02 Python
Python 程序员必须掌握的日志记录
2020/08/17 Python
详解Python中的Lock和Rlock
2021/01/26 Python
canvas实现有递增动画的环形进度条的实现方法
2019/07/10 HTML / CSS
html5通过canvas实现刮刮卡效果示例分享
2014/01/27 HTML / CSS
英国奢侈品在线精品店:Hervia
2020/09/03 全球购物
十一个高级MySql面试题
2014/10/06 面试题
初始化了一个没有run()方法的线程类,是否会出错?
2014/03/27 面试题
事业单位接收函
2014/01/10 职场文书
制药工程专业个人求职自荐信
2014/01/25 职场文书
个人总结与自我评价
2015/02/14 职场文书
大客户经理岗位职责
2015/04/09 职场文书
Java中的Kafka为什么性能这么快及4大核心详析
2022/09/23 Java/Android