JR 精品文章 - HTML 中 javascript 实现的排序
AD: jr (at) javaresearch.org


首页 | 动态 | 文章 | FAQ  | 新闻 | 下载 | 代码 | 工作 | 调查 | 术语 | 站点 | 图书 | 论坛 | 帮助 | 全部  

TOP | 交流 | 软件 | 专栏 | 开源 | 译/著 | 源码 | API  | 推荐 | FTP  | 积分 | 统计 | 搜索 | Blog | 我们  
首页 » 研究文集 » 其它 搜索标题相关文章 搜索标题相关文章    评论此文章 发表评论     开始监控此文章 开始监控   加入收藏夹  加入收藏夹
HTML 中 javascript 实现的排序
nuaaqy 原创   更新:2007-11-29 16:52:22  版本: 1.0   

利用这个脚本可以将数据库中读取出来的数据直接在页面上进行排序,而避免在数据库中排序对数据库的重复操作。

<html>
<script language="javascript">
var sorttype = 1; //desc
  function sortByCol(colNum){
    //排序         
    var parNode = document.getElementById("listtable"); //定位到table上       
    for(var i=0; i<parNode.rows.length-1; i++)
    {
     for(var n=1; n<parNode.rows.length-1-i; n++){  
      var ifrom = parNode.rows.length-n;
      var ito = parNode.rows.length-n-1;
      if(sorttype==1){
        if(parNode.rows[ifrom].cells[colNum].childNodes[0].data > parNode.rows[ito].cells[colNum].childNodes[0].data){
            parNode.moveRow(ifrom,ito); //from-to
        }
      }else{
        if(parNode.rows[ifrom].cells[colNum].childNodes[0].data < parNode.rows[ito].cells[colNum].childNodes[0].data){
            parNode.moveRow(ifrom,ito); //from-to
        }
      }
     }
    } 
    sorttype = 0 - sorttype; //asc
  }
</script>
<body>
<table id="listtable" width="100%" border="1" cellpadding="0" cellspacing="1">
<tr><th onclick="sortByCol(0);">序号</th><th onclick="sortByCol(1);">姓名</th>
<th onclick="sortByCol(2);">年龄</th><th onclick="sortByCol(3);">班级</th><th onclick="sortByCol(4);">成绩</th></tr>
<tr><td>1</td><td>ZXE</td><td>56</td><td>1</td><td>13</td></tr>
<tr><td>2</td><td>SCHB</td><td>34</td><td>3</td><td>23</td></tr>
<tr><td>3</td><td>WE</td><td>23</td><td>3</td><td>34</td></tr>
<tr><td>4</td><td>SQD</td><td>34</td><td>2</td><td>76</td></tr>
<tr><td>5</td><td>EDE</td><td>67</td><td>1</td><td>34</td></tr>
<tr><td>6</td><td>BD</td><td>32</td><td>2</td><td>78</td></tr>
<tr><td>7</td><td>AA</td><td>23</td><td>1</td><td>34</td></tr>
</body>
</html>

版权声明   给作者写信
本篇文章对您是否有帮助?  投票:         投票结果:     14       0
作者其它文章: 作者全部文章
评论人:Jaln 发表时间: Tue Dec 04 11:28:38 CST 2007
这样每次载入页面都要重新排序,很可能会给性能上带来问题

这个文章共有 1 条评论
主题: 【问题讨论】jsp页面两分钟刷新一次,实现后,Session的失效时间为半个小时,所以Session永远都不回失效了! 上一篇文章
返回文章列表 返回〔其它〕
下一篇文章 主题: 项目总结(和大家分享一下)


文字广告链接
        自主、快速定制基于JAVA的B/S业务系统          重量级企业在线自定义WEB报表平台
        Excel制表、零代码发布、打印、图表结合——快逸报表,免费、稳定、功能强大的java工具
        技术圈: 关于Java、dotNet、PHP、Ruby、奇客、Web2.0等更多资讯博客精选文章

关于 JR  |  版权声明  |  联系我们 

©2002-2006 JR 版权所有 沪ICP备05019622号