基于基于jquery的表格排序的表格排序
很多高手也位jquery写了专门的排序库，因为自己也想尝试一下，
当然运行速度实在不能接受，但是我会慢慢的把他改进的。
注：这里只是拿出了一部分代码来，查看演示demo
文档载入后给’th’添加click事件。
1.
$(‘th’).click(function(){
var date1=(new Date()).getTime()
var dataType=$(this).attr(‘dataType’);
找到点击对象的自定义属性dataType，当然这个不符合W3C的标准是无法通过检验的，也可以用ID或者class来定义，但是我
觉得这样直观点在Transitional模式下也可以正常解读.
2.
var index=$(‘th’).index(this)+1;
找到被点击对象在文档中的位置加上1,加1是为了给所对应的列的td添加样式才做的。
因为用:eq()只能得到td的全文档位置，而用：nth-child()的话得到的是每个td在自己的父元素里面的序列位置。
3.
var row=$(‘tbody tr’);
将tbody里所有tr存到变量row.
4.
$.each(row,function(i){ arr[i]=row[i] })
遍历所有行讲它插入arr数组.
5.if($(this).hasClass(‘select’)){arr.reverse()}
如果这个’th’被点击过那么它将会被添加select样式，如果是这样直接将原来的arr数组反向。
6.
else {
arr.sort(sortStr(index,dataType))
$(‘.select’).removeClass();
$(‘td:nth-child(‘+index+’)’).addClass(‘select’);
$(this).addClass(‘select’)
}
否则，将arr用sort()方法进行排序sort()方式可以接受1个函数，这个函数接受2个参数作为需要比较的数据，我在这里定义为
sortStr();
它有两个参数:
代码如下:
function sortStr(index,dataType){
return function(a,b){
var aText=$(a).find(‘td:nth-child(‘+index+’)’).text();
var bText=$(b).find(‘td:nth-child(‘+index+’)’).text();
if(dataType!=’roomType’){
aText=Parse(aText,dataType)
bText=Parse(bText,dataType)
return aText>;bText?-1:bText>;aText?1:0;
}
else return aText.localeCompare(bText)
}
}
第一个是index，它是在click事件中获得的变量，这个变量包含了被点击的那个’th’的在文档中的位置是一个数字，
jquert的index()方法获得对象的位置，这个位置从0算起，这个例子中有6个’th’；
第二个参数是dataType,他包含每个’th’的属性值。
sortStr()里面包含了一个比较的函数，这个函数是匿名函数，它有2个参数每个参数代表着一个’tbody tr’，（在这里a和b代表
需要比较的tr）这两个参数是在包含他的函数环境中获取的，sort()方法里面的参数，在这是一个函数，这个函数都会获得数组
对象的元素，
这个匿名函数返回对操作数组的引用。
arr里面包含的一个数组，每个数组的值包含对tbody里面的tr的引用，排序函数按照返回的值对原有数组里面的元素直接进行
位置的改变，
var aText=$(a).find(‘td:nth-child(‘+index+’)’).text();
获取需要比较的行里面其中一个td里面包含的文本这个就是需要比较的值，
click事件中得到的index变量成为参数传递到这里就是为了得到th所对应的td的位置；
代码如下:
if(dataType!=’roomType’){
aText=Parse(aText,dataType)
bText=Parse(bText,dataType)
return aText>;bText?-1:bText>;aText?1:0;
}
剩余9页未读，继续阅读
资源评论
