Auntion-TableSort国人写的一个javascript表格排序的东西
Auntion-TableSort最新版 修复了一个数字排序的问题.放出下载 07年5月5日
Auntion TableSort 测试交流第一版
(下一版将会存在部分表格相关特效)
-----------------------------------------------------------------------------
作者:Auntion
blog:Auntion.blogbus.com
e-mail:Auntion@Gmail.com
QQ:82874972
-----------------------------------------------------------------------------
注:
转载请将此说明全部发出,因为可能会有新手不会用,并且该说明会有更详细的扩展说明.
为了国内javascript水平的共同进步,让我们一起努力!
此版为3天完成,今后可能会有升级,请关注我的blog.
-----------------------------------------------------------------------------
主要功能如下:
兼容ie , firefox核心.其他的我没有测试过,我只装这两个浏览器
支持可视编辑,跟以往一样的做table,只用设置一个id即可使用
排序:
数字:根据大小可按照降升序排列
字母:同数字
日期:同数字,格式中不要包含中文
单选、复选框:按照true或false排列
中文:按照第一个字相同的排列.
提供用户接口定义.可以自己实现不同的触发排序的方式
封装,继承,多态.
继承请使用prototype
-----------------------------------------------------------------------------
>对于新手:
如何使用?
请参看 使用实例_1.htm :
■ 建立一个table
■ 如需美化请设置他的css样式
■ 设置表头,即给触发该列排序的td一个class名字
■ 创建对象,即初试化tableSort这个类.
■ 使用默认的排序触发方式
如果初始化?
var apply = new tableSort("bodys","tag");
apply.toTagStart();//这里将使用已经定义的一种默认触发方式.
■ 其中"bodys"为表格的id(可为object或string) -- 根据你的表格ID而改变
■ 其中"tag"为每列头td的class名
>对于有兴趣扩展的朋友:
本类将提供一个可扩展的模式,当前仅限于触发的方式,即用户接口.
具体请参看tableSort.class.js
注:
可以通过不同的方式触发排序-步骤:
1.创建对象
2.(此部根据情况可选用) 多态方式设置其中的 tempCellIndex属性 为欲排序的列的下标
如我要给第三行排序,tempCellIndex属性即为3
3.获取与设置状态(参看tableSort.class.js中的注释)
4.改变列头的css样式
5.初始化开始排序
(第一部和第二部不包含在用户接口之内,为创建对象时的操作)
(其中第二部为创建对象之后进行设置)
我表达能力不太好,如果不明白请看tableSort.class.js中
/**通过点击标签触发排序事件**/这一部分
打包下载
相关推荐
-
tablesorter.js表格排序使用方法(支持中文排序)
最近,因为项目需要,对表格排序做了一下摸索,整理如下: 1. 首先,可从官网下载tablesorter.js,但并不支持中文的排序,对其源码进行修改: 部分源码: function sortText(a, b) { return ((a < b) ? -1 : ((a > b) ? 1 : 0)); }; function sortTextDesc(a, b) { return ((b < a) ? -1 : ((b > a) ? 1 : 0)); }; 修改后: function
-
jQuery html表格排序插件tablesorter使用方法详解
tablesort是一款很好用的jQuery表格排序插件. 支持多种数据类型排序,会自动识别表格内容数据类型,使用也非常方便. 使用jQuery tablesort实现html表格方法: 1. 下载jQuery和tablesort脚本,并在html中引用该脚本文件: <script type="text/javascript" src="../jquery-latest.js"></script> <script type="
-
TableSort.js表格排序插件使用方法详解
本文实例为大家分享了TableSort.js表格排序的具体代码,供大家参考,具体内容如下 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>TableSort</title> <style type="text/css"> table { bor
-
jQuery表格排序组件-tablesorter使用示例
一.引入文件 复制代码 代码如下: <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/jquery.tablesorter.js"></script> <!-- 引入以下样式则表头出现排序图标,同时引入图片 --> <
-
Juery解决tablesorter中文排序和字符范围的方法
本文实例讲述了Juery解决tablesorter中文排序和字符范围的方法.分享给大家供大家参考.具体分析如下: tablesorter是jQuery插件中比较优秀的一款表格排序插件,我相信大家都使用过或有所耳闻,我在这里就不过多介绍了,详细信息可以看看官方网站:http://tablesorter.com/docs/(其中的demo做得比较完整). 在使用了tablesorter开发的几个项目中,发现了两种类型的排序存在问题,如下: 第一个问题是无法对中文字符进行排序,这是因为在对字符排序时,
-
jQuery排序插件tableSorter使用方法
本文实例为大家分享了jQuery排序插件tableSorter的使用方法,供大家参考,具体内容如下 1.先引两个js <script type="text/javascript" src="../js/jquery-1.3.2.min.js"></script> <script type="text/javascript" src="../js/jquery.tablesorter.min.js"
-
javascript 表格排序和表头浮动效果(扩展SortTable)
一.SortTable说明 SortTable version 2 7th April 2007 Stuart Langridge, http://www.kryogenix.org/code/browser/sorttable/ Instructions: Download this file Add <script src="sorttable.js"></script> to your HTML Add class="sortable"
-
修复jQuery tablesorter无法正确排序的bug(加千分位数字后)
找到函数: function getElementText(config, node) { var text = ""; if (!node) return ""; if (!config.supportsTextContent) config.supportsTextContent = node.textContent || false; if (config.textExtraction == "simple") { if (config.s
-
jquery tablesorter.js 支持中文表格排序改进
代码: 仿一个网友的代码写的,不记得出自哪里了,改成可以支持中文排序,而且支持控件value的排序. 没办法,能力有限,只能... 复制代码 代码如下: //转换器,将列的字段类型转换为可以排序的类型:String,int,float function convert(sValue, sDataType) { switch(sDataType) { case "int": return parseInt(sValue); case "float": return p
-
Auntion-TableSort国人写的一个javascript表格排序的东西
Auntion-TableSort最新版 修复了一个数字排序的问题.放出下载 07年5月5日 Auntion TableSort 测试交流第一版 (下一版将会存在部分表格相关特效) ----------------------------------------------------------------------------- 作者:Auntion blog:Auntion.blogbus.com e-mail:Auntion@Gmail.com QQ:82874972 --------
-
33种Javascript 表格排序控件收集
1. jQuery tablesorter http://tablesorter.com/docs/ 2. Table sorting with Prototype http://tetlaw.id.au/view/blog/table-sorting-with-prototype/ 3. Sorttable http://www.kryogenix.org/code/browser/sorttable/ 4. Table Sorting Javascript http://yoast.com/
-
分享一个自己写的table表格排序js插件(高效简洁)
像:jQuery的table排序插件(感觉其使用比较麻烦或不清楚其具体用法,就没有使用).原生态js的table排序插件等,最后比较看了下--采用了一个原生态js的table排序插件,并在其基础上做了些修改,虽有些勉强或有些地方使用不太舒服,但最算是比较好的实现了当时需要的功能.而前两天,对原有表格做了点儿修改--增加隔行换色的功能,问题就出现了,--效果错乱:检查分析了下,问题出在其table排序插件代码上--其原代码写的比较难理解,修改还不如重新自己写一个table排序插件. 说写就写,ta
-
java编程自写一款JavaScript超实用表格插件
目录 使用效果 文档说明 第一步 第二步 第三步 源码 使用效果 文档说明 第一步 从tableFactory获图标Form对象. 或者: 第二步 加载参数,传入json对象 表格效果: json参数明细: 实例: 对应于: 第三步 将table加载到页面中对应ID的div中. 如: 根据列数可以动态调整TD的宽度 单独放入一个文件,可以直接调用. 源码 //表格工厂 var tableFactory = function(type){ if(this instanceof tableFacto
-
如何写出一个惊艳面试官的JavaScript深拷贝
目录 导读 深拷贝和浅拷贝的定义 乞丐版 基础版本 考虑数组 循环引用 性能优化 其他数据类型 合理的判断引用类型 获取数据类型 可继续遍历的类型 不可继续遍历的类型 克隆函数 最后 参考 小结 导读 最近经常看到很多JavaScript手写代码的文章总结,里面提供了很多JavaScript Api的手写实现. 里面的题目实现大多类似,而且说实话很多代码在我看来是非常简陋的,如果我作为面试官,看到这样的代码,在我心里是不会合格的,本篇文章我拿最简单的深拷贝来讲一讲. 看本文之前先问自己三个问题:
-
jquery.tableSort.js表格排序插件使用方法详解
本文实例为大家分享了jquery.tableSort.js表格排序的具体代码,供大家参考,具体内容如下 1.一定要引jQuery包,所有jq插件都是基于jQuery包的 2.如果想指定哪一栏不排序这样写 $("#mytable").tablesorter({headers:{5:{sorter:false}}}); 第5列的sorter为false就OK了 参考:http://www.jb51.net/article/105217.htm <!DOCTYPE html> &
-
JavaScript实现表格排序方法
参考代码: 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equ
-
JavaScript Sort 表格排序
1.你真的懂JavaScript里面的Sort方法吗? 2.你知道JavaScript中 localeCompare 方法的函数体吗? 3.表格排序 方法 要哪些参数? JavaScript中的sort方法直接就提供了排序的功能,不需要我们自己写个循环一个个的判断.但其机制仍然是那样的, 复制代码 代码如下: window.onload=function(){ var MyArr=new Array("red","green","gray");
-
javascript实现表格排序 编辑 拖拽 缩放
简单表格排序 可以双击编辑 自定义编辑后的 规则 可拖动列进行列替换 可推动边框进行列宽度的缩放 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xht
随机推荐
- JavaScript定义类或函数的几种方式小结
- 用正则表达式格式化html标签的代码
- DW网页编辑常用表现的实现方法
- CentOS 7.2配置Apache服务httpd(下)
- MyBatis之自查询使用递归实现 N级联动效果(两种实现方式)
- 从零开始学习Node.js系列教程五:服务器监听方法示例
- 比较不错的打印效果 css
- Chrome浏览器的alert弹窗禁止再次弹出后恢复的方法
- 使用批处理bat更改hosts的多个方法
- jQuery在线选座位插件seat-charts特效代码分享
- vue2.x 父组件监听子组件事件并传回信息的方法
- Apache2 WEB服务器的配置步骤分享
- 详解Python的Django框架中的通用视图
- Android中的AppWidget入门教程
- C++实现查壳程序代码实例
- android 更改TextView中任意位置字体大小和颜色的方法
- java实现图片上插入文字并保存
- 使用Python实现画一个中国地图
- python 比较2张图片的相似度的方法示例
- python如何从键盘获取输入实例