您的位置：首页 > Web前端 > JavaScript

js 处理表格排序(中英文)

2007-04-01 21:47 281 查看

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

"http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<title>Sort table</title>

</head>

<script>...

<!--

var flag1, flag2, flag3;

flag1 = true;

flag2 = true;

flag3 = true;

//clear rows for table

function clearAllRows(oTable)...{

for(var i=oTable.rows.length-1;i>0;i--)...{

oTable.deleteRow(i);

}

function addRows(oTable, Person)...{

var rowid = oTable.rows.length;

var row = oTable.insertRow(rowid);

var cell=row.insertCell();

cell.innerText = Person.getId();

var cell = row.insertCell();

cell.innerHTML = Person.getName();

var cell=row.insertCell();

cell.innerHTML=Person.getAge();

}

function sortBy(index)...{

var oTable = document.getElementById("t1");

//get data from table

var arr = new Array();

//skip the first row, because it is the head of the table

for(var i = 1;i < oTable.rows.length; i++)...{

var id = oTable.rows[i].cells[0].innerText;

var name = oTable.rows[i].cells[1].innerText;

var age = oTable.rows[i].cells[2].innerText;

arr[i - 1] = new Person(id, name, age);

}

//process sort

switch(index)...{

case 0:

if(flag1)...{

//sort ascending

arr.sort(function(a,b)...{

return parseInt(a.getId()) - parseInt(b.getId());

});

flag1 = false;

}else...{

//sort desc

arr.sort(function(a,b)...{

return parseInt(b.getId()) - parseInt(a.getId());

});

flag1 = true;

}

break;

case 1:

if(flag2)...{

arr.sort(function(a,b)...{return a.getName().localeCompare(b.getName());});

flag2 = false;

}else...{

arr.sort(function(a,b)...{return a.getName().localeCompare(b.getName());});

arr.reverse();

flag2 = true;

}

break;

case 2:

if(flag3)...{

arr.sort(function(a,b)...{

return parseInt(a.getAge()) - parseInt(b.getAge());

});

flag3 = false;

}else...{

arr.sort(function(a,b)...{

return parseInt(b.getAge()) - parseInt(a.getAge());

});

flag3 = true;

}

break;

}

//clear the all rows except the head of the table

clearAllRows(oTable);

//add the rows

for(var i = 0; i < arr.length; i++)...{

addRows(oTable, arr[i]);

}

function Person(id, name, age)...{

this.id = id;

this.name = name;

this.age = age;

}

new Person('', '', '');

Person.prototype.getId = function() ...{ return this.id;}

Person.prototype.getName = function() ...{ return this.name;}

Person.prototype.getAge = function() ...{ return this.age;}

Person.prototype.toString = function() ...{ return this.name;}

-->

</script>

<tr>

</tr>

<tr>

</tr>

<tr>

</tr>

<tr>

</tr>

<tr>

</tr>

</table>

</body>

</html>

说明数组默认的排序方法不能按照中文拼音字母顺序排序,这里使用新方法locateCompare进行处理

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航