学电脑,学计算机 | 手机访问 | 加入收藏 | 设为首页 | RSS
当前位置:首页 > 网页制作 > Javascript教程 > 正文

JavaScript表格排序()转

发布时间:2009-09-14 22:32:01  来源:本站整理
【摘要】: JavaScript表格排序()转

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<html xmlns="<head>
<title>JavaScript表格排序</title>;
</head>
<body>
<table style="width: 151px" id="t1">
<tr>
<td style="cursor:pointer">
标题1</td>
<td>
标题2</td>
<td>
标题3</td>
</tr>
<tr>
<td>
a</td>
<td>
3</td>
<td>
d</td>
</tr>
<tr>
<td>
b</td>
<td>
2</td>
<td>
c</td>
</tr>
<tr>
<td>
c</td>
<td>
1</td>
<td>
a</td>
</tr>
</table>
<script>
enableTableSort("t1");
function enableTableSort(id)
{
var mytable=document.getElementById(id);

for(var i=0;i<mytable.rows[0].cells.length;i++)
{
mytable.rows[0].cells[i].onclick=sortTable(id,i);
mytable.rows[0].cells[i].style.cursor="pointer";
mytable.rows[0].cells[i].style.background="#f0f000";
}



function sortrow(cellIndex,sortDirection)
{
return function(row1,row2)
{
var value1= row1.cells[cellIndex].firstChild.nodeValue
var value2= row2.cells[cellIndex].firstChild.nodeValue
if(value1>value2)
{
return sortDirection
}
else if(value1<value2)
{
return sortDirection;
};
else return 0;
}
}

function sortTable(id,cellIndex)
{
return function()
{
var mytable=document.getElementById(id);
var tbody=mytable.tBodies[0];
var trows=tbody.rows;
var sortDirection=mytable.getAttribute("sortDirection")?mytable.getAttribute("sortDirection"):1;
var arows=[];



for(var i=1;i<trows.length;i++)
arows.push(trows[i]);

mytable.setAttribute("sortDirection",sortDirection?-1:1)


arows.sort(sortrow(cellIndex,sortDirection));


var docFragment=document.createDocumentFragment();

for(var i=0;i<arows.length;i++)
{
docFragment.appendChild(arows[i]);
}

tbody.appendChild(docFragment);



}
}


}

</script>
</body>
</html>

发表评论 共有条评论
验证码:
澳门网络赌场