table行的选择(含ctrl,shift)

table行的选择(含ctrl,shift),ctrl按下则支持无序多选,shift按下则支持有序多选

<html >

<head >
<meta   http-equiv="Content-Type"   content="text/html;   charset=gb2312" >
<title >new   page </title >
<script >
var   ctrl=false;
var   shift=false;
document.onkeydown=function   (){
if(event.keyCode==17){
ctrl=true;
}else   if(event.keyCode==16){
shift=true;
}
};
document.onkeyup=function   (){
ctrl=false;
shift=false;
}
function   choose(obj){
var   rowI=event.srcElement.parentNode.rowIndex;
if(ctrl&&shift)   return;
if(!ctrl&&!shift){
for(var   i=0;i <table1.rows.length;i++){
table1.rows(i).cells(0).firstChild.checked=false;
table1.rows(i).bgColor="";
}
table1.rows(rowI).cells(0).firstChild.checked=true;
table1.rows(rowI).bgColor="red";
table1.currentRow=rowI;
}
if(ctrl){
table1.rows(rowI).cells(0).firstChild.checked=true;
table1.rows(rowI).bgColor="red";
}
if(shift){
for(var   i=0;i <table1.rows.length;i++){
table1.rows(i).cells(0).firstChild.checked=false;
table1.rows(i).bgColor="";
}
if(rowI <table1.currentRow){
for(var   i=rowI;i <=table1.currentRow;i++){
table1.rows(parseInt(i)).cells(0).firstChild.checked=true;
table1.rows(parseInt(i)).bgColor="red";
}
}else{
for(var   i=table1.currentRow;i <=rowI;i++){
table1.rows(parseInt(i)).cells(0).firstChild.checked=true;
table1.rows(parseInt(i)).bgColor="red";
}
}
}
}
</script >

</head >

<body >
<table   cellpadding="0"   border="1"   cellspacing="0"   width="400"   id="table1"   currentRow="0"   onclick="choose(this)" >
<tr   bgcolor="red" >
<td > <input   type=checkbox   checked >  </td >
<td >  </td >
</tr >
<tr >
<td > <input   type=checkbox >  </td >
<td >  </td >
</tr >
<tr >
<td > <input   type=checkbox >  </td >
<td >  </td >
</tr >
<tr >
<td > <input   type=checkbox >  </td >
<td >  </td >
</tr >
<tr >
<td > <input   type=checkbox >  </td >
<td >  </td >
</tr >
<tr >
<td > <input   type=checkbox >  </td >
<td >  </td >
</tr >
<tr >
<td > <input   type=checkbox >  </td >
<td >  </td >
</tr >
<tr >
<td > <input   type=checkbox >  </td >
<td >  </td >
</tr >
</table >


</body >

</html > 

阅读更多
个人分类: javascript
想对作者说点什么? 我来说一句

没有更多推荐了,返回首页

不良信息举报

table行的选择(含ctrl,shift)

最多只允许输入30个字

加入CSDN,享受更精准的内容推荐,与500万程序员共同成长!
关闭
关闭