Jquery实现checkbox按shift多选
2024-09-17 10:58:13
html
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<script src="jquery.min.js"></script>
<script src="shiftCheck.js"></script>
</head>
<body>
<table id="table">
<tr><td><input type="checkbox" ></td><td>hehe</td></tr>
<tr><td><input type="checkbox" ></td><td>hehe</td></tr>
<tr><td><input type="checkbox" ></td><td>hehe</td></tr>
<tr><td><input type="checkbox" ></td><td>hehe</td></tr>
<tr><td><input type="checkbox" ></td><td>hehe</td></tr>
<tr><td><input type="checkbox" ></td><td>hehe</td></tr>
</table>
</body>
</html>
js
function enableShiftCheck(checkboxs) {
let startChecked;
function handleCheck(e) {
if(e.shiftKey){
let thisIndex = checkboxs.index(this);
let startIndex = checkboxs.index(startChecked);
let startNum = thisIndex < startIndex ? thisIndex : startIndex;
let endNum = thisIndex > startIndex ? thisIndex : startIndex;
for(let i = startNum; i <= endNum; i++) {
if(this.checked) {
checkboxs.eq(i).prop("checked", true);
} else {
checkboxs.eq(i).prop("checked", false);
}
}
}
startChecked = this;
}
checkboxs.click(handleCheck);
} $(function(){
enableShiftCheck($("#table :checkbox"));
});
最新文章
- ,net core mvc 文件上传
- struts中Cookie实现记住密码
- C#对象克隆介绍
- Unity3D特效-场景淡入淡出
- Jsp技术总结
- RDIFramework.NET V2.7 Web版本升手风琴+树型目录(2级+)方法
- DOM初涉
- 一些常用的jQuery插件
- winform textbox 的自动实现功能
- 异常-----springmvc + ajaxfileupload解决ajax不能异步上传图片的问题。java.lang.ClassCastException: org.apache.catalina.connector.RequestFacade cannot be cast to org.springframework.web.multipart.
- swiper 应用
- XSS跨站脚本小结(转)
- Ubuntu 14.04服务器配置 (1) 安装和配置
- 批量导入导出站点权限site permissions
- Physics for Game Programmers (Grant Palmer 著)
- JS 对话框 语法
- [PHP] B2B2C商品模块数据库设计
- 如何写出优雅的JavaScript代码 ? &;&; 注释
- 53. Reverse Words in a String【easy】
- mysql mapper 大于小于号 tag name expected
热门文章
- Google Adsense Google判断广告点击作弊的方式和数据 数据分析
- [Day21]异常
- linux sed 用法
- Kali 开启 SSH 服务方法
- 附录A application.properties配置项
- 类的命名空间&;组合
- 搭建docker私有仓库(https)
- Byword for Mac(Markdown编辑器)中文版
- 图解:window与BOM的关系
- TypeError: Fetch argument 0.484375 has invalid type <;class &#39;numpy.float32&#39;>;, must be a string or Tensor. (Can not convert a float32 into a Tensor or Operation.)