LOGO 首页 OA教程 ERP教程 模切知识交流 PMS教程 CRM教程 技术文档 其他文档  
 
网站管理员

可以拖动改变table列宽的sample

admin
2011年4月11日 17:47 本文热度 5566
可以拖动改变table列宽的sample
[code]













标题二标题三标题四
内容A内容B内容C内容D
内容A内容B内容C内容D
内容A内容B内容C内容D
内容A内容B内容C内容D
内容A内容B内容C内容D
内容A内容B内容C内容D
内容A内容B内容C内容D

<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 编辑过
关键字查询
相关文章
正在查询...
点晴ERP是一款针对中小制造业的专业生产管理软件系统,系统成熟度和易用性得到了国内大量中小企业的青睐。
点晴PMS码头管理系统主要针对港口码头集装箱与散货日常运作、调度、堆场、车队、财务费用、相关报表等业务管理,结合码头的业务特点,围绕调度、堆场作业而开发的。集技术的先进性、管理的有效性于一体,是物流码头及其他港口类企业的高效ERP管理信息系统。
点晴WMS仓储管理系统提供了货物产品管理,销售管理,采购管理,仓储管理,仓库管理,保质期管理,货位管理,库位管理,生产管理,WMS管理系统,标签打印,条形码,二维码管理,批号管理软件。
点晴免费OA是一款软件和通用服务都免费,不限功能、不限时间、不限用户的免费OA协同办公管理系统。
Copyright 2010-2026 ClickSun All Rights Reserved  粤ICP备13012886号-2  粤公网安备44030602007207号