可以拖动改变table列宽的sample
当前位置:点晴教程→知识管理交流
→『 技术文档交流 』
可以拖动改变table列宽的sample
[code]
<script language="javascript"> setResizeAble(tbl); var onDrag=0,gblResizeObj; var blStartMove = false; var blTd = false; function setResizeAble(argTable){ //组件接口函数 with(argTable){ attachEvent('onmousedown',colResizeStart) attachEvent('onmousemove',colResizeIng) attachEvent('onmouseup',colResizeEnd) // attachEvent('onmouseout',colResizeOut) //针对最末列引起的问题加入,但又影响到其他列,还是不加 } } function findPos(obj){ //取得本元素的绝对坐标 var x=obj.offsetLeft, y=obj.offsetTop; while(obj=obj.offsetParent){x += obj.offsetLeft;y += obj.offsetTop;} this.intX=x; this.intY=y; return this } function colResizeStart(){ //开始拖动 blStartMove = true; var srcObj=event.srcElement,tblParent=srcObj.parentElement; while(tblParent.tagName!='TABLE')tblParent=tblParent.parentElement if(srcObj.tagName!='TD')return if(srcObj.parentElement.rowIndex==0){ // if(srcObj.offsetWidth - event.offsetX <=3 && srcObj.cellIndex!=srcObj.parentElement.cells.length - 1){ if(srcObj.offsetWidth - event.offsetX <=3){ //如果取消最末列的动态改列宽功能可用上句 gblResizeObj=tblParent.rows[srcObj.parentElement.rowIndex].cells[srcObj.cellIndex]; onDrag=1; } if(event.offsetX <=3 && srcObj.cellIndex != 0){ gblResizeObj=tblParent.rows[srcObj.parentElement.rowIndex].cells[srcObj.cellIndex - 1]; onDrag=1; } } //else{ //if(srcObj.offsetHeight - event.offsetY <=3 && srcObj.parentElement.rowIndex < tblParent.rows.length - 1){ // gblResizeObj=tblParent.rows[srcObj.parentElement.rowIndex].cells[srcObj.cellIndex]; // onDrag=2; //} //} } function colResizeIng(){ //正在拖动 var objSrcTd=event.srcElement,tblParent=objSrcTd.parentElement; while(tblParent=tblParent.parentElement)if(tblParent.tagName=='TABLE')break; if(objSrcTd.tagName == "TD" && (Math.abs(event.offsetX) <= 3 ││ Math.abs(objSrcTd.offsetWidth - event.offsetX)<=3) && objSrcTd.cellIndex != 0 && objSrcTd.parentElement.rowIndex==0){ blTd = true; objSrcTd.document.body.style.cursor='col-resize'; } else{ // if(objSrcTd.tagName == "TD" && Math.abs(objSrcTd.offsetHeight - event.offsetY)<=3 && objSrcTd.parentElement.rowIndex > 0 && objSrcTd.parentElement.rowIndex < tblParent.rows.length - 1){ // objSrcTd.document.body.style.cursor='row-resize'; // }else{ if(blStartMove) objSrcTd.document.body.style.cursor='default'; // } } if(onDrag!=1 && onDrag!=2)return; var trSrc=gblResizeObj.parentElement; if(onDrag==1){ var intPosX=(new findPos(gblResizeObj)).intX gblResizeObj.style.pixelWidth = event.x - intPosX; } // if(onDrag==2){ //改变行高 // var intHeight=0,intPosY=(new findPos(gblResizeObj)).intY // intHeight = objSrcTd.offsetHeight + event.y - intPosY; // tblParent.style.pixelHeight = intHeight * tblParent.rows.length // } } function colResizeEnd(){ //拖动结束 blStartMove = false; onDrag=0; document.body.style.cursor='default' } /**//* function colResizeOut(){ //鼠标移出Table范围则拖动结束 if(event.srcElement.tagName=="TABLE"){ onDrag=0; document.body.style.cursor='default'; } } */ </script> [/code] 该文章在 2011/4/11 17:48:13 编辑过 |
关键字查询
相关文章
正在查询... |