jquery表格排序

最新推荐文章于 2021-06-15 11:42:26 发布

hello_malk

最新推荐文章于 2021-06-15 11:42:26 发布

阅读量89

点赞数

文章标签： jQuery J# HTML ViewUI

本文链接：https://blog.csdn.net/hello_malk/article/details/83524621

版权

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"/>
<title>jq sort</title>
</head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$.fn.sort=function(fun){
var d=this
var dom=this.find('tr:gt(0)')
dom.each(function(i){
dom.each(function(j){
if(j<=i){
return true;
}
var dom1=dom.eq(i)
var dom2=dom.eq(j)
if(fun(dom1,dom2)){
dom1.before(dom2);
dom=d.find('tr:gt(0)')
}
})
})
}
$(document).ready(function(){
$('tr th').each(function(i){
$(this).toggle(function(){
$(this).parent().parent().sort(function(dom1,dom2){
var value1=parseInt(dom1.find('td:eq('+i+')').text());
var value2=parseInt(dom2.find('td:eq('+i+')').text());
return value1>value2
})
},function(){
$(this).parent().parent().sort(function(dom1,dom2){
var value1=parseInt(dom1.find('td:eq('+i+')').text());
var value2=parseInt(dom2.find('td:eq('+i+')').text());
return value1<value2
})
})
})
})
</script>
<body>
<table>
<tr>
<th>序号</th>
<th>数量</th>
</tr>
<tr>
<td>10</td>
<td>10</td>
</tr>
<tr>
<td>1</td>
<td>2</td>
</tr>
<tr>
<td>11</td>
<td>27</td>
</tr>
<tr>
<td>9</td>
<td>2</td>
</tr>
</table>
</body>
</html>