对于一系列数据通过单击进行排序(每次只能单击一次)
2009-08-30 11:52
429 查看
<html>
<head>
<title>Table Sort Example</title>
<script type="text/javascript">
function generateCompareTRs(iCol) {
return function compareTRs(oTR1, oTR2) {
var sValue1 = oTR1.cells[iCol].firstChild.nodeValue;
var sValue2 = oTR2.cells[iCol].firstChild.nodeValue;
return sValue1.localeCompare(sValue2);
};
}
function sortTable(sTableID, iCol) {
var oTable = document.getElementById(sTableID);
var oTBody = oTable.tBodies[0];
var colDataRows = oTBody.rows;
var aTRs = new Array;
for (var i=0; i < colDataRows.length; i++) {
aTRs[i] = colDataRows[i];
}
aTRs.sort(generateCompareTRs(iCol)); //表示按升序排列
var oFragment = document.createDocumentFragment();
for (var i=0; i < aTRs.length; i++) {
oFragment.appendChild(aTRs[i]);
}
oTBody.appendChild(oFragment);
}
</script>
</head>
<body>
<p>Click on the table header to sort in ascending order.</p>
<table border="1" id="tblSort">
<thead>
<tr>
<th onclick="sortTable('tblSort', 0)" style="cursor:pointer">Last Name</th>
<th onclick="sortTable('tblSort', 1)" style="cursor:pointer">First Name</th>
</tr>
</thead>
<tbody>
<tr>
<td>Smith</td>
<td>John</td>
</tr>
<tr>
<td>Johnson</td>
<td>Betty</td>
</tr>
<tr>
<td>Henderson</td>
<td>Nathan</td>
</tr>
<tr>
<td>Williams</td>
<td>James</td>
</tr>
<tr>
<td>Gilliam</td>
<td>Michael</td>
</tr>
<tr>
<td>Walker</td>
<td>Matthew</td>
</tr>
</tbody>
</table>
</body>
</html>
-----------------------说明----------------------
文中两个函数用来调用以达到排序的目的
<head>
<title>Table Sort Example</title>
<script type="text/javascript">
function generateCompareTRs(iCol) {
return function compareTRs(oTR1, oTR2) {
var sValue1 = oTR1.cells[iCol].firstChild.nodeValue;
var sValue2 = oTR2.cells[iCol].firstChild.nodeValue;
return sValue1.localeCompare(sValue2);
};
}
function sortTable(sTableID, iCol) {
var oTable = document.getElementById(sTableID);
var oTBody = oTable.tBodies[0];
var colDataRows = oTBody.rows;
var aTRs = new Array;
for (var i=0; i < colDataRows.length; i++) {
aTRs[i] = colDataRows[i];
}
aTRs.sort(generateCompareTRs(iCol)); //表示按升序排列
var oFragment = document.createDocumentFragment();
for (var i=0; i < aTRs.length; i++) {
oFragment.appendChild(aTRs[i]);
}
oTBody.appendChild(oFragment);
}
</script>
</head>
<body>
<p>Click on the table header to sort in ascending order.</p>
<table border="1" id="tblSort">
<thead>
<tr>
<th onclick="sortTable('tblSort', 0)" style="cursor:pointer">Last Name</th>
<th onclick="sortTable('tblSort', 1)" style="cursor:pointer">First Name</th>
</tr>
</thead>
<tbody>
<tr>
<td>Smith</td>
<td>John</td>
</tr>
<tr>
<td>Johnson</td>
<td>Betty</td>
</tr>
<tr>
<td>Henderson</td>
<td>Nathan</td>
</tr>
<tr>
<td>Williams</td>
<td>James</td>
</tr>
<tr>
<td>Gilliam</td>
<td>Michael</td>
</tr>
<tr>
<td>Walker</td>
<td>Matthew</td>
</tr>
</tbody>
</table>
</body>
</html>
-----------------------说明----------------------
文中两个函数用来调用以达到排序的目的
相关文章推荐
- 对于一系列数据通过单击进行排序(可以多次单击)
- PB中通过单击数据窗口中的列来对数据进行排序
- 22-OC中通过block对NSArray中的数据进行排序
- 单击数据窗口的列进行排序
- 对于集合内装载的对象数据进行自定义排序 !
- 长度为N的数组乱序存放着0带N-1.现在只能进行0与其他数的swap操作,请设计并实现排序,必须通过交换实现排序。
- 队列和栈面试题(一)— 请编写一个程序,按升序对栈进行排序,要求最多只能使用一个额外的栈存放临时数据
- 长度为N的数组乱序存放着0带N-1.现在只能进行0与其他数的swap操作,请设计并实现排序,必须通过交换实现排序。
- 数据窗口单击标题栏自动进行排序,并显示升降序/拖动行可以改变行顺序
- 静态数据成员只能在类体外,且通过函数体进行初始化(静态数据成员是在程序编译时被分配空间的)
- 一次请求对多条数据进行排序的算法(二)
- 转自:http://m.blog.csdn.net/article/details?id=6554168 在使用order by语句进行查询结果排序时,不同的数据库对于被排序字段数据行为null的情况
- 一次请求对多条数据进行排序的算法(一)
- mysql通过拷贝数据文件的方式进行数据库迁移
- android中点击item时通过不同数据进行不同的操作
- Android手机通过wifi进行数据传输(三)
- Java--对于 class文件进行加密 然后通过我们自己写的类加载器进行加载指定类
- 使用Okhttp框架访问接口数据,通过RecyclerView进行数据展示
- GridView允许你通过EditIndex属性来修改数据的一行,同样也必须进行整行更新
- (八) 通过jdbc对对solr进行数据的增量导入