代码如下:
<!--
all rights by Lonsan on 2005
email:[email protected]
-->
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=gb2312">
<title>HTML中利用堆栈方式对Table进行行排序</title>
<style>
body,table
{}{}{}{
font-size:9pt;
}
.grid
{}{}{}{
border:1 solid #6666FF;
width:460;
}
.grid tr
{}{}{}{
cursor:hand;
}
.grid td
{}{}{}{
border:1 solid #6666FF;
}
</style>
<script language="javascript">
<!--
function select(tr)
{
if(grid.selectedTr!=null)
{
grid.selectedTr.style.backgroundColor="";
}
grid.selectedTr=tr;
tr.style.backgroundColor="#FFCC00";
}
function isselected()
{
if(grid.selectedTr==null)
return false;
return true;
}
function push(s)
{
if(grid.stack==null)
grid.stack=[];
grid.stack.push(s);
}
function pop()
{
if(grid.stack==null)
return null;
return grid.stack.pop();
}
function movetop()
{
if(!isselected()) return;
var s=[];
s.push(grid.selectedTr.rowIndex);
s.push(0);
push(s);
grid.moveRow(grid.selectedTr.rowIndex, 0);
}
function moveup()
{
if(!isselected()) return;
var s=[];
s.push(grid.selectedTr.rowIndex);
s.push(Math.max(grid.selectedTr.rowIndex-1,0));
push(s);
grid.moveRow(grid.selectedTr.rowIndex, Math.max(grid.selectedTr.rowIndex-1,0));
}
function movedown()
{
if(!isselected()) return;
var s=[];
s.push(grid.selectedTr.rowIndex);
s.push(Math.min(grid.selectedTr.rowIndex+1,grid.rows.length-1));
push(s);
grid.moveRow(grid.selectedTr.rowIndex, Math.min(grid.selectedTr.rowIndex+1,grid.rows.length-1));
}
function movebottom()
{
if(!isselected()) return;
var s=[];
s.push(grid.selectedTr.rowIndex);
s.push(grid.rows.length-1);
push(s);
grid.moveRow(grid.selectedTr.rowIndex, grid.rows.length-1);
}
function cancelmove()
{
if(grid.stack==null || grid.stack.length==0)
return;
var s=pop();
if(s!=null)
{
select(grid.rows[s[1]]);
grid.moveRow(s[1],s[0]);
}
}
function cancelall()
{
if(grid.stack!=null && grid.stack.length>0)
{
cancelmove();
window.setTimeout(cancelall, 2000);
}
else if(grid.stack!=null)
{
alert("over!!!");
}
}
//-->
</script>
</head>
<body>
<table id="grid" class="grid">
<tr onclick="select(this);">
<td>1</td>
<td>[email protected]</td>
<td>蓝山</td>
<td>Asp.Net</td>
<td>JS</td>
</tr>
<tr onclick="select(this);">
<td>2</td>
<td>[email protected]</td>
<td>蓝山</td>
<td>Asp.Net</td>
<td>JS</td>
</tr>
<tr onclick="select(this);">
<td>3</td>
<td>[email protected]</td>
<td>蓝山</td>
<td>Asp.Net</td>
<td>JS</td>
</tr>
<tr onclick="select(this);">
<td>4</td>
<td>[email protected]</td>
<td>蓝山</td>
<td>Asp.Net</td>
<td>JS</td>
</tr>
<tr onclick="select(this);">
<td>5</td>
<td>[email protected]</td>
<td>蓝山</td>
<td>Asp.Net</td>
<td>JS</td>
</tr>
<tr onclick="select(this);">
<td>6</td>
<td>[email protected]</td>
<td>蓝山</td>
<td>Asp.Net</td>
<td>JS</td>
</tr>
</table>
<br>
<a href="javascript:movetop();">Top</a>
<a href="javascript:moveup();">Up</a>
<a href="javascript:movedown();">Down</a>
<a href="javascript:movebottom();">Bottom</a>
<a href="javascript:cancelmove();">Cancel</a>
<a href="javascript:cancelall();">CancelAll</a>
</body>
</html>
[Ctrl+A 全选 提示:你可先修改部分代码,再点运行代码]
转自: http://www.cnblogs.com/Lonsan/archive/2005/04/09/table.html
本文地址:http://com.8s8s.com/it/it30681.htm