<!-- 
 all rights by Lonsan on 2005
 email:Lonsan21@163.com
-->
<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>Lonsan21@163.com</td>
  
<td>蓝山</td>
  
<td>Asp.Net</td>
  
<td>JS</td>
 
</tr>
 
<tr onclick="select(this);">
  
<td>2</td>
  
<td>Lonsan21@163.com</td>
  
<td>蓝山</td>
  
<td>Asp.Net</td>
  
<td>JS</td>
 
</tr>
 
<tr onclick="select(this);">
  
<td>3</td>
  
<td>Lonsan21@163.com</td>
  
<td>蓝山</td>
  
<td>Asp.Net</td>
  
<td>JS</td>
 
</tr>
 
<tr onclick="select(this);">
  
<td>4</td>
  
<td>Lonsan21@163.com</td>
  
<td>蓝山</td>
  
<td>Asp.Net</td>
  
<td>JS</td>
 
</tr>
 
<tr onclick="select(this);">
  
<td>5</td>
  
<td>Lonsan21@163.com</td>
  
<td>蓝山</td>
  
<td>Asp.Net</td>
  
<td>JS</td>
 
</tr>
 
<tr onclick="select(this);">
  
<td>6</td>
  
<td>Lonsan21@163.com</td>
  
<td>蓝山</td>
  
<td>Asp.Net</td>
  
<td>JS</td>
 
</tr>
</table>
<br>
<href="javascript:movetop();">Top</a>
<href="javascript:moveup();">Up</a>
<href="javascript:movedown();">Down</a>
<href="javascript:movebottom();">Bottom</a>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<href="javascript:cancelmove();">Cancel</a>
<href="javascript:cancelall();">CancelAll</a>
</body>
</html>

posted on 2005-04-09 12:34  蓝山  阅读(1833)  评论(1)    收藏  举报