首頁 > web前端 > js教程 > 写的htc的数据表格_javascript技巧

写的htc的数据表格_javascript技巧

WBOY
發布: 2016-05-16 19:20:34
原創
1272 人瀏覽過

作者:xmg (小马哥) 

复制代码 代码如下:






<script> <BR>if(document.all){ <BR> Event.prototype.__defineGetter__("srcElement",function(){var node=this.target;while(node.nodeType!=1){node=node.parentNode}return node}) <BR> Event.prototype.__defineGetter__("x",function(){return this.clientX+2}) <BR> Event.prototype.__defineGetter__("y",function(){return this.clientY+2}) <BR>} <BR>function $(obj){return document.getElementById(obj)} <BR></script>


  
    
    
    
    
    
    
    
    
    
    
  
  
    
    
    
    
    
    
    
    
    
    
  
  
    
    
    
    
    
    
    
    
    
    
  
  
    
    
    
    
    
    
    
    
    
    
  
  
    
    
    
    
    
    
    
    
    
    
  
  
    
    
    
    
    
    
    
    
    
    
  
字段一 字段二 字段三 字段四 字段五 字段六 字段七 字段八 字段九



<script> <BR>var obj=$("datagrid"),td <BR>var body=document.body <BR>var DragObj=null <BR>var objxy=getxy(obj) <BR>var Dragborder=0 <BR>obj.style.cssText="background:#FFF;border-collapse:collapse" <BR>for(var i=0;i<obj.rows.length;i++){ <BR> for(var j=0;j<obj.rows[i].cells.length;j++){ <BR> td=obj.rows[i].cells[j] <BR> if(i==0){ <BR> td.className="GridBorder" <BR> td.style.cssText="font-weight:bold" <BR> }else if(j==0){ <BR> td.className="GridBorder" <BR> td.style.cssText="width:15px" <BR> }else{ <BR> td.innerHTML="<input type=text value='"+td.innerHTML.replace(/ /gi,'')+"' style='width:100%;border:0px'>" <BR> } <BR> } <BR>} <BR>var focus_img=document.createElement("IMG") <BR>focus_img.src="http://bbs.51js.com/attachment.php?aid=7290&noupdate=yes" <BR>if(typeof(Dline)!="object"){ <BR> var Dragline=document.createElement("DIV") <BR> Dragline.id="Dline" <BR> Dragline.style.cssText="width:1px;border-left:1px solid #CCC;display:none;position:absolute" <BR> body.appendChild(Dragline) <BR>} <BR>obj.onclick=function(){ <BR> var e=event,tr <BR> var ee=e.srcElement <BR> if(ee.tagName=="INPUT"){ <BR> tr=ee.parentNode.parentNode <BR> obj.rows[tr.rowIndex].cells[0].appendChild(focus_img) <BR> } <BR>} <BR>obj.onmousemove=function(){ <BR> var e=event,tr <BR> var ee=e.srcElement <BR> if(ee.tagName=="TD"&&ee.parentNode.rowIndex==0&&ee.cellIndex>0){ <BR> var a=getxy(ee) <BR> if(event.x<(a[1]+5)||event.x>(a[1]+a[2]-5)){ <BR> body.style.cursor="col-resize" <BR> objxy=getxy(obj) <BR> }else{ <BR> body.style.cursor="default" <BR> } <BR> } <BR>} <BR>obj.onmousedown=function(){ <BR> var e=event <BR> var ee=e.srcElement <BR> var a=getxy(ee) <BR> if(body.style.cursor=="col-resize"){ <BR> if(event.x<(a[1]+5)) <BR> Dragborder=1 <BR> else if(event.x>(a[1]+a[2]-5)) <BR> Dragborder=2 <BR> else <BR> Dragborder=0 <BR> DragObj=ee <BR> $("Dline").style.left=e.x <BR> $("Dline").style.top=objxy[0] <BR> $("Dline").style.height=objxy[3] <BR> $("Dline").style.display="" <BR> } <BR>} <BR>body.onmousemove=function(){ <BR> if(DragObj!=null){ <BR> $("Dline").style.left=event.x <BR> body.style.cursor="col-resize" <BR> } <BR>} <BR>body.onmouseup=function(){ <BR> if(DragObj!=null){ <BR> $("Dline").style.display="none" <BR> body.style.cursor="default" <BR> if(Dragborder==2){ <BR> var a=getxy(DragObj) <BR> var w=event.x-a[1] <BR> w=w<=0?0:w <BR> DragObj.style.width=w <BR> } <BR> if(Dragborder==1){ <BR> var pnode=DragObj.previousSibling <BR> var a=getxy(pnode) <BR> var w=event.x-a[1] <BR> w=w<=0?0:w <BR> pnode.style.width=w <BR> } <BR> DragObj=null <BR> } <BR>} <BR>function getxy(e){ <BR> var a=new Array() <BR> var t=e.offsetTop; <BR> var l=e.offsetLeft; <BR> var w=e.offsetWidth; <BR> var h=e.offsetHeight; <BR> while(e=e.offsetParent){ <BR> t+=e.offsetTop; <BR> l+=e.offsetLeft; <BR> } <BR> a[0]=t;a[1]=l;a[2]=w;a[3]=h <BR> return a; <BR>} <BR></script>
相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板