<html> <body> <table class='fr-table' id="idTable"> <thead> <tr > <td ><span id="idTitle">所属税务机关（或税管员）</span></td> <td><a href="javascript:void(0)" mce_href="javascript:void(0)" id="idAddtime">已完全填报率(%)</a><br> ⑤=②/①</td> <td ><a href="javascript:void(0)" mce_href="javascript:void(0)" id="idSize">未完全填报率(%)<br> ⑥=③/①</td> <td >未填报率(%)<br> ⑦=④/①</td> </tr> </thead> <tbody > <tr > <td>3423324</td> <td _order="0.07"> 0.07</td> <td> 0.00</td> <td > 99.93</td> </tr> <tr > <td >2342342</td> <td _order="0.00"> 0.00</td> <td > 0.06</td> <td> 99.94</td> </tr> <tr> <td >234234</td> <td _order="0.00"> 0.06</td> <td > 0.00</td> <td> 99.94</td> </tr> <tr > <td >232</td> <td _order="0.00"> 0.00</td> <td > 0.02</td> <td> 99.98</td> </tr> <tr > <td >23423</td> <td _order="0.00"> 0.00</td> <td> 0.00</td> <td > 100.00</td> </tr> <tr> <td>12312</td> <td _order="0.00"> 0.00</td> <td > 0.00</td> <td > 100.00</td> </tr> </tbody> </table> <mce:script type="text/javascript"><!-- var $ = function (id) { return "string" == typeof id ? document.getElementById(id) : id; }; var Class = { create: function() { return function() { this.initialize.apply(this, arguments); } } } Object.extend = function(destination, source) { for (var property in source) { destination[property] = source[property]; } return destination; } Function.prototype.bind = function(object) { var __method = this, args = Array.prototype.slice.call(arguments); args.shift(); return function() { return __method.apply(object, args.concat(Array.prototype.slice.call(arguments))); } } function Each(list, fun){ for (var i = 0, len = list.length; i < len; i++) { fun(list[i], i); } }; var TableOrder = Class.create(); TableOrder.prototype = { initialize: function(table) { this.tBody = $(table).tBodies[0];//tbody对象 this.Rows = [];//行集合 this._order = null;//排序对象 Each(this.tBody.rows, function(o){ this.Rows.push(o); }.bind(this)); }, //排序并显示 Sort: function() { //没有排序对象返回 if(!this._order){ return false }; //排序 this.Rows.sort(this._order.Compare || this.Compare.bind(this)); this._order.Down && this.Rows.reverse();//取反 //显示表格 var oFragment = document.createDocumentFragment(); Each(this.Rows, function(o){ oFragment.appendChild(o); }); this.tBody.appendChild(oFragment); //执行附加函数 this._order.onSort(); }, //比较函数 Compare: function(o1, o2) { var value1 = this.GetValue(o1), value2 = this.GetValue(o2); return value1 < value2 ? -1 : value1 > value2 ? 1 : 0; }, //获取比较值 GetValue: function(tr) { var td = tr.getElementsByTagName("td")[this._order.Index], data = td[this._order.Attri] || td.getAttribute(this._order.Attri); //数据转换 switch (this._order.DataType.toLowerCase()) { case "int": return parseInt(data) || 0; case "float": return parseFloat(data) || 0; case "date": return Date.parse(data) || 0; case "string": default: return data.toString() || ""; } }, //添加并返回一个排序对象 Add: function(index, options) { var oThis = this; return new function(){ //默认属性 this.Attri = "innerHTML";//获取数据的属性 this.DataType = "string";//比较的数据类型 this.Down = true;//是否按顺序 this.onSort = function(){};//排序时执行 this.Compare = null;//自定义排序函数 Object.extend(this, options || {}); //td索引 this.Index = index; this.Sort = function(){ oThis._order = this; oThis.Sort(); }; }; } } var to = new TableOrder("idTable"); function SetOrder(obj, index, options){ var o = $(obj); //_arr是记录排序项目（这里主要用来设置样式） !SetOrder._arr && (SetOrder._arr = []); SetOrder._arr.push(o); //添加一个排序对象 var order = to.Add(index, options); order.onSort = function(){ //设置样式 Each(SetOrder._arr, function(o){ if(o.innerHTML.lastIndexOf('-')>0){ o.innerHTML = o.innerHTML.substring(0,o.innerHTML.lastIndexOf('-')); } }); o.innerHTML = order.Down ? o.innerHTML+"-↓" : o.innerHTML+"-↑"; //取相反排序 order.Down = !order.Down } o.onclick = function(){ order.Sort(); return false; } } SetOrder("idTitle", 0); SetOrder("idAddtime", 1, { Attri: "_order", DataType: "string" }); SetOrder("idSize", 2, { Attri: "innerHTML", DataType: "float" }); // --></mce:script> </body> </html>
扫一扫
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
