未命名  
檔案下載:38895517


<script>
(function (w) {

if (w.gridSort) {
return new Error('系統中以存在gridSort類');
}
var GridSort = function (GID) {
this.Grid = document.getElementById(GID);
this.Gbody = this.Grid.tBodies[0];
this.Ghead = this.Grid.tHead;
}
GridSort._StringByConvert = function (val, valType) {
if (!valType) return val.toString();
switch (valType.toLowerCase()) {
case 'int':
return parseInt(val);
case 'float':
return parseFloat(val);
case 'date':
return new Date(Date.parse(val));
default:
return val.toString();
}
}
return (function(){
var _rowPrevVal = GridSort._StringByConvert(arguments[0].cells[colIdx].firstChild.nodeValue, colType), //這個相當於A參數
_rowAfterVal = GridSort._StringByConvert(arguments[1].cells[colIdx].firstChild.nodeValue, colType); //這個相當於B參數
if (_rowPrevVal < _rowAfterVal)
return -1;
else if (_rowPrevVal > _rowAfterVal)
return 1;
else
return 0;
});
}
GridSort.prototype.BindClickHeadSort = function () {
var _rowsHead = this.Ghead.rows[0].cells,
_gbody = this.Gbody,
_gridRows = _gbody.rows,
_girdSort = this._Sequence;
for (var i = 0, count = _rowsHead.length; i < count; i++) {
(function (idx) {
_rowsHead[idx].onclick = function () {
var _sortRows = [],
_sortType = this.getAttribute('stype'),
_orderby = _gbody.getAttribute('orderby');
for (var i = 0, count = _gridRows.length; i < count; i++) {
_sortRows[i] = _gridRows[i];
}

if (!_orderby) {
//開始執行Array的Sort()函數,可能很多童鞋都還米有看見過Sort()函數中加參數的用法
//不了解Sort()函數參數的童鞋,請馬上跳到_Sequence()函數那裡繼續看吧,那裡我會解釋
_sortRows.sort(_girdSort(idx, _sortType));
_gbody.setAttribute('orderby', 'asc');
} else {
_sortRows.reverse();
_gbody.removeAttribute('orderby');
}
var _newRows = document.createDocumentFragment();
for (var j = 0, count2 = _sortRows.length; j < count2; j++) {
_newRows.appendChild(_sortRows[j]);
}
_gbody.appendChild(_newRows);
}
})(i);
}
}
w.gridSort = (function (gid) { new GridSort(gid).BindClickHeadSort(); });
})(window);

</script>

<table width="400" id="tab">
<thead>
<tr>
<th width="100">First Name</th>
<th width="100">Last Name</th>
<th width="100" stype="date">Date</th>
<th width="100" stype="int">Int</th>
</tr>
</thead>
<tbody>
<tr>
<td>Kingwell</td>
<td>Leng</td>
<td>3/10/2012</td>
<td>1</td>
</tr>
<tr>
<td>1aJim</td>
<td>Green</td>
<td>3/5/2012</td>
<td>2</td>
</tr>
<tr>
<td>Kate</td>
<td>Bin</td>
<td>1/2/2012</td>
<td>3</td>
</tr>
<tr>
<td>Zte</td>
<td>Ri</td>
<td>5/3/2012</td>
<td>33</td>
</tr>
<tr>
<td>Bee</td>
<td>Dd</td>
<td>8/1/2012</td>
<td>15</td>
</tr>
</tbody>
</table>
<script type="text/javascript">
gridSort('tab');
</script>

創作者介紹
創作者 shadow 的頭像
shadow

資訊園

shadow 發表在 痞客邦 留言(0) 人氣()