太陽雨
          
				
          痛并快樂著
          
			          		
		
          
	
          

          

          
	
          
		
          
		    
		        
		        BlogJava
首頁
新隨筆
聯系
聚合

管理

			
			
				

          
	
          
		
          
			
			
			
				 
				67 
				Posts ::
				3 Stories
				::
				33 Comments
				::
				0 Trackbacks
			
		
          
	
          

          

			          		
		
          
	
          

          


          



          
	
					

          
	
	
	
          
		
          <html> 
          
          <head> 
          
          <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 
          
          <style type="text/css">*{font-size:14px}button{margin:3px}</style> 
          
          <script type="text/javascript"> 
          

          
          var mytable=null,mytable2=null; 
          

          
window.onload          =function(){ 
          
mytable          =new CTable("tbl",10); 
          
mytable2          =new CTable("tbl2",6); 
          
}           
          

          
Array.prototype.each          =function(f){for(var i=0;i<this.length;i++) f(this[i],i,this)} 
          

          
          function $A(arrayLike){ 
          
          for(var i=0,ret=[];i<arrayLike.length;i++) ret.push(arrayLike[i]); 
          
          return ret 
          
}           
          

          
Function.prototype.bind           = function() { 
          
            var __method = this, args = $A(arguments), object = args.shift(); 
          
            return function() { 
          
              return __method.apply(object, args.concat($A(arguments))); 
          
  }           
          
}           
          

          

          
          function CTable(id,rows){ 
          
          this.tbl=typeof(id)=="string"?document.getElementById(id):id;  
          
          if (rows && /^\d+$/.test(rows)) this.addrows(rows) 
          
}           
          

          
CTable.prototype          ={ 
          
addrows:          function(n){          //隨機添加n個tr 
          
          new Array(n).each(this.add.bind(this)) 
          
}          , 
          
add:          function(){           //添加1個tr 
          
          var self=this; 
          
          var tr = self.tbl.insertRow(-1),td1= tr.insertCell(-1),td2= tr.insertCell(-1),td3= tr.insertCell(-1); 
          
          var chkbox=document.createElement("INPUT") 
          
chkbox.type          ="checkbox" 
          
chkbox.onclick          =self.highlight.bind(self) 
          
td1.appendChild(chkbox) 
          
td1.setAttribute(          "width","35") 
          
td2.innerHTML          =Math.ceil(Math.random()*99) 
          
td3.innerHTML          =Math.ceil(Math.random()*99) 
          
}          , 
          
del:          function(){           //刪除所選tr 
          
          var self=this 
          
$A(self.tbl.rows).each(          function(tr){if (self.getChkBox(tr).checked) tr.parentNode.removeChild(tr)}) 
          
}          , 
          
up:          function(){              //上移所選tr 
          
          var self=this 
          
          var upOne=function(tr){          //上移1個tr 
          
          if (tr.rowIndex>0){ 
          
self.swapTr(tr,self.tbl.rows[tr.rowIndex          -1]) 
          
self.getChkBox(tr).checked          =true 
          
}           
          
}           
          
          var arr=$A(self.tbl.rows).reverse() 
          
          if (arr.length>0 && self.getChkBox(arr[arr.length-1]).checked){ 
          
          for(var i=arr.length-1;i>=0;i--){ 
          
          if (self.getChkBox(arr[i]).checked){ 
          
arr.pop()            
          
}          else{ 
          
          break 
          
}           
          
}           
          
}           
          
arr.reverse().each(          function(tr){if (self.getChkBox(tr).checked) upOne(tr)}); 
          
}          , 
          
down:          function(){ 
          
          var self=this 
          
          var downOne=function(tr){       
          
          if (tr.rowIndex<self.tbl.rows.length-1)  { 
          
self.swapTr(tr,self.tbl.rows[tr.rowIndex          +1]); 
          
self.getChkBox(tr).checked          =true; 
          
}           
          
}           
          
          var arr=$A(self.tbl.rows) 
          

          
          if (arr.length>0 && self.getChkBox(arr[arr.length-1]).checked){ 
          
          for(var i=arr.length-1;i>=0;i--){ 
          
          if (self.getChkBox(arr[i]).checked){ 
          
arr.pop() 
          
}          else{ 
          
          break 
          
}           
          
}           
          
}           
          
arr.reverse().each(          function(tr){if (self.getChkBox(tr).checked) downOne(tr)}); 
          
}          , 
          
sort:          function(){           //排序   
          
          var self=this,order=arguments[0]; 
          
          var sortBy=function(a,b){ 
          
          if (typeof(order)=="number"){  //數字,則按數字指示的列排序 
          
          return Number(a.cells[order].innerHTML)>=Number(b.cells[order].innerHTML)?1:-1;   //轉化為數字類型比較大小 
          
          }          else if (typeof(order)=="function"){     //為程序,按 程序的返回結果排序 
          
          return order(a,b); 
          
}          else{ 
          
          return 1; 
          
}           
          
}           
          
$A(self.tbl.rows).sort(sortBy).each(          function(x){ 
          
          var checkStatus=self.getChkBox(x).checked; 
          
self.tbl.firstChild.appendChild(x); 
          
          if (checkStatus) self.getChkBox(x).checked=checkStatus; 
          
}          ); 
          
}          , 
          
rnd:          function(){           //隨即選擇幾行tr 
          
          var self=this,selmax=0,tbl=self.tbl; 
          
          if (tbl.rows.length){ 
          
 selmax          =Math.max(Math.ceil(tbl.rows.length/4),1);  //選擇的行數不超過tr數的1/4 
          
           $A(tbl.rows).each(function(x){ 
          
self.getChkBox(x).checked          =false; 
          
self.restoreBgColor(x) 
          
}          ) 
          
}          else{ 
          
          return alert("無數據可以選") 
          
}           
          
          new Array(selmax).each(function(){ 
          
          var tr=tbl.rows[Math.floor(Math.random()*tbl.rows.length)] 
          
self.getChkBox(tr).checked          =true; 
          
self.highlight(          {target:self.getChkBox(tr)}) 
          
}          ) 
          
}          , 
          
highlight:          function(){               //設置tr的背景色 
          
          var self=this; 
          
          var evt=arguments[0] || window.event 
          
          var chkbox=evt.srcElement || evt.target 
          
          var tr=chkbox.parentNode.parentNode 
          
chkbox.checked          ?self.setBgColor(tr):self.restoreBgColor(tr) 
          
}          , 
          
swapTr:          function(tr1,tr2){             //交換tr1和tr2的位置 
          
          var target=(tr1.rowIndex<tr2.rowIndex)?tr2.nextSibling:tr2; 
          
          var tBody=tr1.parentNode 
          
tBody.replaceChild(tr2,tr1); 
          
    tBody.insertBefore(tr1,target); 
          
}          , 
          
getChkBox:          function(tr){           //從tr得到 checkbox對象 
          
          return tr.cells[0].firstChild 
          
}          , 
          
restoreBgColor:          function(tr){           
          
tr.style.backgroundColor          ="#ffffff"  
          
}          , 
          
setBgColor:          function(tr){ 
          
tr.style.backgroundColor          ="#c0c0c0" 
          
}           
          
}           
          

          
          function f(a,b){ 
          
          var sumRow=function(row){return Number(row.cells[1].innerHTML)+Number(row.cells[2].innerHTML)}; 
          
          return sumRow(a)>sumRow(b)?1:-1; 
          
}           
          

          
          </script> 
          

          
          </head> 
          
          <body> 
          

          
          <button  onClick="javascript:mytable.rnd()">隨機選擇行</button> 
          
          <button  onClick="javascript:mytable.add()">添加一行</button> 
          
          <button  onClick="javascript:mytable.del()">刪除選定行</button> 
          
          <button  onClick="javascript:mytable.up()">上移選定行</button> 
          
          <button  onClick="javascript:mytable.down()">下移選定行</button> 
          
          <button  onClick="javascript:mytable.sort(1)">按第一列數字排序</button> 
          
          <button  onClick="javascript:mytable.sort(f)">按每行數據的和排序</button> 
          

          

          
 
          
          <table width=100%> 
          
          <tr> 
          
          <td valign="top"><table border id="tbl" width="80%"></table></td> 
          
          <td valign="top"><table border id="tbl2" width="80%"></table></td> 
          
          </tr> 
          
          </table> 
          

          

          
 
          
          <button  onClick="javascript:mytable2.rnd()">隨機選擇行</button> 
          
          <button  onClick="javascript:mytable2.add()">添加一行</button> 
          
          <button  onClick="javascript:mytable2.del()">刪除選定行</button> 
          
          <button  onClick="javascript:mytable2.up()">上移選定行</button> 
          
          <button  onClick="javascript:mytable2.down()">下移選定行</button> 
          
          <button  onClick="javascript:mytable2.sort(2)">按第二列數字排序</button> 
          
          <button  onClick="javascript:mytable2.sort(f)">按每行數據的和排序</button> 
          

          
          </body> 
          
          </html>
          

          


           
          

	
          
	
	
          
		posted on 2008-12-02 13:21 小蟲旺福 閱讀(1377) 評論(0)  編輯  收藏  所屬分類: Javascript相關 
	
          

          







          
	    
    




          








          

				

          



    







          
        
	




主站蜘蛛池模板：
浑源县|
凉山|
瑞丽市|
广东省|
巴青县|
漾濞|
栾城县|
嘉峪关市|
汤阴县|
西华县|
马鞍山市|
江川县|
邮箱|
滨州市|
萨嘎县|
盖州市|
崇左市|
滦南县|
镇赉县|
九龙县|
青铜峡市|
海原县|
兴宁市|
千阳县|
宣威市|
宁武县|
渝中区|
资阳市|
安乡县|
句容市|
大连市|
久治县|
益阳市|
屏边|
浦北县|
滦平县|
陆河县|
噶尔县|
张掖市|
栖霞市|
剑河县|