http://www.evget.com/zh-CN/Info/catalog/7683.html效果如上,但是有个需求,同一行可能存在多列!
(比如第三行,上移,会移动到与第二行同行,再上移,才会移动到第二行上面) * 做一个角色权限高低的排序,有可能不同角色权限一样,(同一行)
类似这样:局长
副局长
主任 副主任
科长 副科长
科员
(比如第三行,上移,会移动到与第二行同行,再上移,才会移动到第二行上面) * 做一个角色权限高低的排序,有可能不同角色权限一样,(同一行)
类似这样:局长
副局长
主任 副主任
科长 副科长
科员
<HEAD>
<TITLE>TestTable</TITLE>
<script>
var tb ;
function setOrder(order,cl)
{
// debugger;
tb = tb|| document.getElementById("tableBody");
var arr =[];
for(var i=0;i<tb.rows.length;i++){
arr.push(tb.rows[i]);
}
if(order==1) // 升序
{
arr.sort(function(a,b){return cl==0 ? (a.cells[0].innerHTML > b.cells[0].innerHTML?1:-1) : parseInt( a.cells[1].innerHTML) - parseInt(b.cells[1].innerHTML) ; });
}
else
{
arr.sort(function(a,b){return cl==0 ?(a.cells[0].innerHTML < b.cells[0].innerHTML?1:-1) : parseInt( b.cells[1].innerHTML) - parseInt(a.cells[1].innerHTML); });
}
while(tb.hasChildNodes()){
tb.removeChild(tb.lastChild);
}
for (var i = 0; i < arr.length; i++) {
tb.appendChild(arr[i]);
}
return false;
}
</script>
</HEAD>
<BODY>
<br />
<table border="1" bordercolor='#000000' align="center" style="border-collapse:collapse;width:500px">
<thead>
<tr>
<td width="200px">
<a href='#' onclick="setOrder(1,0)"> 升序 </a> <a href='#' onclick="setOrder(0,0)"> 降序 </a>
</td>
<td width="200px">
<a href='#' onclick="setOrder(1,1)"> 升序 </a> <a href='#' onclick="setOrder(0,1)"> 降序 </a>
</td>
</tr>
</thead>
<tbody id="tableBody">
<tr id="topTr">
<td width="200px">
aa
</td>
<td width="200px">
234
</td>
</tr>
<tr id="Tr1">
<td width="200px">
sddg
</td>
<td width="200px">
235342
</td>
</tr>
<tr id="Tr2">
<td width="200px">
sadf
</td>
<td width="200px">
6543
</td>
</tr>
<tr id="Tr3">
<td width="200px">
twer
</td>
<td width="200px">
2343
</td>
</tr>
</tbody>
</table>
</BODY>
</HTML>