JS实现HTML表格排序功能

前端之家收集整理的这篇文章主要介绍了JS实现HTML表格排序功能前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

本文实例为大家分享了JavaScript实现HTML表格排序功能,供大家参考,具体内容如下

HTML

代码

JavaScirpt

代码

标签td this.up = classUp; this.down = classDown; this.startRow = startRow; this.selectClass = selectClass; this.endRow = (endRow == 999? this.rows.length : endRow); this.T2Arr = this._td2Array();//所有受影响的td的二维数组 this.setShow(); },//设置标签切换 setShow:function(){ var defaultClass = this.Tags[0].className; for(var Tag,i=0;Tag = this.Tags[i];i++){ Tag.index = i; addEventListener(Tag,'click',Bind(Tag,statu)); } var _this =this; var turn = 0; function statu(){ for(var i=0;i<_this.Tags.length;i++){ _this.Tags[i].className = defaultClass; } if(turn==0){ addClass(this,_this.down) _this.startArray(0,this.index); turn=1; }else{ addClass(this,_this.up) _this.startArray(1,this.index); turn=0; } } },//设置选中列样式 colClassSet:function(num,cla){ //得到关联到的td for(var i= (this.startRow-1);i<(this.endRow);i++){ for(var n=0;n方法中去 this.array2Td(num,afterSort);//输出 },//将受影响的行和列转换成二维数组 _td2Array:function(){ var arr=[]; for(var i=(this.startRow-1),l=0;i<(this.endRow);i++,l++){ arr[l]=[]; for(var n=0;n输出相应的行和列的 innerHTML array2Td:function(num,arr){ this.colClassSet(num,this.selectClass); for(var i= (this.startRow-1),l++){ for(var n=0;n标记 function killHTML(str){ return str.replace(/<[^>]+>/g,""); } //------------------------------------------------ //tableid 第几行是标签行,从第几行开始排序,第几行结束排序(999表示最后) 升序标签样式,降序标签样式 选中列样式 //注意标签行的class应该是一致的 var ex1 = new tableSort('table',1,2,999,'up','down','hov');

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程之家。

原文链接:https://www.f2er.com/js/46785.html

猜你在找的JavaScript相关文章