教程集 > jQuery > jquery 教程 > 正文 js功能-按Ctrl键多选表格行

js功能-按Ctrl键多选表格行

发布时间：2023-12-22 编辑：jiaochengji.com

教程集为您提供js功能-按Ctrl键多选表格行等资源，欢迎您收藏本站，我们将为您提供最新的js功能-按Ctrl键多选表格行资源

提示：您可以先修改部分代码再运行

js功能-按Ctrl键多选表格行  <?xml version="1.0" encoding="ISO-8859-1"?>  	  	<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">  	<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-US" lang="en-US">    	<head>  		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  		<title> New Document </title>    		<meta name="title" content="" />  		<meta name="author" content="0xs.cn" />  		<meta name="subject" content="" />  		<meta name="language" content="zh-cn" />  		<meta name="keywords" content="" />    		<style type="text/  			/* default css rule */  			body { font: 12px "Verdana, 宋体"; }    			#myTable td {  				-moz-user-select: none;  				-webkit-user-select: none;  			}    			tr.select { background:#fcc; }  		</style>    		<script type="text/<a href=http://111cn.net/js_a/js.html target=_blank >javascript" >  			// shortcut  			function $(s){  				return typeof s == \'object\'?s:document.getElementById(s);  			}    			// check start & end pos  			function checkPos(el){  				var oTable = $(\'myTable\');  				var startPos = oTable.startPos;  				if( startPos != null){  					var endPos = el.rowIndex;  					if(endPos > startPos){  						endPos   ;  					}else{  						endPos --;  					}  					loopRows(oTable, function(cur){ cur.className = \'\'; cur.childNodes[0].childNodes[0].checked = false;}); //clear  					loopRows(oTable, function(cur){ cur.className = \'select\'; cur.childNodes[0].childNodes[0].checked = true; }, startPos, endPos);  					oTable.startPos = null;  					return;  				}  				oTable.startPos = el.rowIndex;  				el.className = \'select\';  			}      			// check and select rows  			function chkSelect(e){  				var e = (e || event);  				var el = this;  				if(e.shiftKey){  					checkPos(el);			  				}  				if(e.ctrlKey){  					el.className = (el.className == \'select\' ? \'\' : \'select\');  					el.childNodes[0].childNodes[0].checked = (el.className == \'select\');  				}  			}    			// get rows & do callback  			function loopRows(oTable, callBack, start, end){  				if(!oTable){  					return;  				}  				callBack = callBack || function(){};  				var trs  = oTable.rows;  				var i = start || 0 , l = end || trs.length;  				var flag = i < l;    				while(flag ? i < l : i > l ){  					var cur = trs[i];  					try{  						callBack(cur, i);  					}catch(e){ if(e == \'break\'){ break; }}  					flag ? i   : i--;  				}  			}    			//init  			function init(){  				var oTable = $(\'myTable\');  				loopRows(oTable, function(cur){ cur.onclick = chkSelect; });  				oTable.startPos = null;  			}    			window.onload = init;  		</script>    	</head>  	  		<body>    			<table cellpadding="0" cellspacing="0" border="1" onselectstart="return false;" width="100%" id="myTable">  			<script type="text/<a href=http://111cn.net/js_a/js.html target=_blank >javascript</a>">  				for(var i = 0; i < 100; i  ){  					document.write('<tr><td><input type="checkbox" /></td><td>' i '</td></tr>');  				}  			</script>  			</table>  			      		</body>  	  	</html>

提示：您可以先修改部分代码再运行

您可能感兴趣的文章：
js禁止页面F5刷新右键与后退的代码
 电脑键盘快捷键大全有那些?盘快捷键使用大全
 PS中常用的快捷键汇总介绍
 文本框禁用右键、复制、粘贴等功能的js代码
 pycharm常用的快捷键总结
 javascript右键弹出图片另存为对话框的代码
 python按什么键运行
 PS7.0中十则快捷操作
 js禁用鼠标右键菜单(加强版)
visual studio 2013快捷键 vs2013常用快捷键大全

上一篇：仿新浪网，sina.com的经典黄色滑动门效果代码下一篇：非主流空间鼠标跟随-水泡鼠标

[关闭]

js功能-按Ctrl键多选表格行

最近更新

浏览排行