<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<meta http-equiv= "Content-type" content= "text/html; Charset=utf-8 "/>
<title> Untitled Document </title>
<style type= "Text/css" >
. desc span{Display:none;
. ASC em{Display:none;
</style>
<script type= "Text/javascript" src= "Sort.js" ></script>
<body>
<table width= "border=" 1 "cellpadding=" 0 "cellspacing=" 0 "sort=" true "id=" Mytab ">
<thead style= "Cursor:pointer" >
<tr>
<TD class= "desc" >ID<span>|</span><em>-</em></td>
<TD class= "desc" >name<span>|</span><em>-</em></td>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td> Happy </td>
</tr>
<tr>
<td>3</td>
<td> Dinner </td>
</tr>
<tr>
<td>5</td>
<td> Open </td>
</tr>
</tbody>
</table>
<table width= "border=" 1 "sort=" true "id=" Mytabs ">
<thead style= "Cursor:pointer" >
<tr>
<TD class= "desc" >ID<span>|</span><em>-</em></td>
<TD class= "desc" >name<span>|</span><em>-</em></td>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td> Happy </td>
</tr>
<tr>
<td>3</td>
<td> Dinner </td>
</tr>
<tr>
<td>5</td>
<td> Open </td>
</tr>
</tbody>
</table>
</body>
/*
Table sorting function
Events: 2012 7 24
DOM node
If the table needs to be sorted add sort= "true" in the Table property
And the ID is unique and is necessary
This JS file can be directly introduced
Because the production of the warehouse has no comment
<table width= "border=" 1 "sort=" true "id=" Mytab ">
<thead style= "Cursor:pointer" >
<tr>
<TD class= "desc" >ID<span>|</span><em>-</em></td>
<TD class= "desc" >name<span>|</span><em>-</em></td>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td> Happy </td>
</tr>
<tr>
<td>3</td>
<td> Dinner </td>
</tr>
<tr>
<td>5</td>
<td> Open </td>
</tr>
</tbody>
</table>
*/
var Core = (function (window) {
return {
Init:function () {
Core.gettablebyid ();
Core.setheadclick ();
},
I:function (ID) {
return document.getElementById (ID);
},
N:function (name) {
return document.getElementsByTagName (name);
},
Config: {
Arr:[]
},
Gettablebyid:function () {
var table_arr=core.n ("table");
for (var i = 0; i < table_arr.length; i++) {
if (Table_arr[i].getattribute ("sort")) {
Core.config.arr.push (Table_arr[i].getattribute ("id"));
}
}
Alert (Core.config.arr)
},
Setheadclick:function () {
var arr = Core.config.arr;
if (!arr.length) return false;
for (var j = 0; j< arr.length;j++) {
var thead = core.i (Arr[j]). getElementsByTagName ("Thead") [0].getelementsbytagname ("TD");
for (var i = 0; i<thead.length;i++) {
if (thead[i].attachevent) {
Thead[i].attachevent ("onclick", core.sortlist)
}else{
Thead[i].addeventlistener ("click", Core.sortlist,false)
}
if (i==0) {
Thead[i].click ();
// }
}
}
},
Sortlist:function (e) {
var index=0,arr=[],sort= "ASC", Table=null;
if (e.srcelement) {
Index=e.srcelement.cellindex;
Sort=e.srcelement.getattribute ("sort");
E.srcelement.classname=sort = "ASC"? "desc": "ASC";
E.srcelement.setattribute ("sort", sort = = "ASC"?) "desc": "ASC");
Table = Core.gettableid (e.srcelement)
}else{
Index=e.currenttarget.cellindex;
Sort=e.currenttarget.getattribute ("sort");
E.currenttarget.classname=sort = "ASC"? "desc": "ASC";
E.currenttarget.setattribute ("sort", sort = = "ASC"?) "desc": "ASC");
Table = Core.gettableid (e.currenttarget)
}
Core.getlist (Table,index,arr);
Core.updatelist (Table,sort,arr);
},
Gettableid:function (p) {
for (Var i=0,n=p;n=n.parentnode;i++) {
if (i>100) break;
if (n.nodename== "TABLE") {
Alert (N.nodename/*n.getattribute ("id") * *)
return n;
}
}
},
Getlist:function (Table,index,arr) {
var table = table.getelementsbytagname ("tbody") [0];
for (var i = 0; i< table.rows.length; i++) {
var item = Table.rows[i];
for (var j = 0; j< item.cells.length;j++) {
var jtem = Item.cells[index];
if (jtem.innerhtml) {
Alert (jtem.innerhtml)
arr[i]=jtem.innerhtml;
}
Break
}
}
},
Updatelist:function (Table,sort,arr) {
var table = table.getelementsbytagname ("tbody") [0];
for (var i = 0; i< arr.length;i++) {
for (var j = i+1;j< arr.length;j++) {
if (sort== "ASC") {
if (Arr[i] > Arr[j]) {
var rwos=table.rows[i].clonenode (true);
Table.replacechild (Table.rows[j],table.rows[i]);
if (j+1==arr.length) {
Table.insertbefore (Rwos,null);
Table.appendchild (RWOS)
}else{
Table.insertbefore (Rwos,table.rows[j]);
}
var tim= arr[i];
Arr.splice (I,1,arr[j]);
Arr.splice (J,1,tim);
}
}else{
if (Arr[i] < arr[j]) {
var rwos=table.rows[i].clonenode (true);
Table.replacechild (Table.rows[j],table.rows[i]);
if (j+1==arr.length) {
Table.insertbefore (Rwos,null);
Table.appendchild (RWOS)
}else{
Table.insertbefore (Rwos,table.rows[j]);
}
var tim= arr[i];
Arr.splice (I,1,arr[j]);
Arr.splice (J,1,tim);
}
}
}
}
}
};
}) (window);
Window.onload=core.init;
