table拖动列宽

var tTD; //用来存储当前更改宽度的Table Cell,避免快速移动鼠标的问题 
var table = document.getElementById("content");
for (j = 0; j < table.rows[0].cells.length; j++) {
    table.rows[0].cells[j].onmousedown = function() {
        //记录单元格
        tTD = this;
        if (event.offsetX > tTD.offsetWidth - 10) {
            tTD.mouseDown = true;
            tTD.oldX = event.x;
            tTD.oldWidth = tTD.offsetWidth;
        }
    };
    table.rows[0].cells[j].onmouseup = function() {
        //结束宽度调整
        if (tTD == undefined) tTD = this;
        tTD.mouseDown = false;
        tTD.style.cursor = 'default';
    };
    table.rows[0].cells[j].onmousemove = function() {
        //更改鼠标样式
        if (event.offsetX > this.offsetWidth - 10) this.style.cursor = 'col-resize';
        else this.style.cursor = 'default';
        //取出暂存的Table Cell
        if (tTD == undefined) tTD = this;
        //调整宽度
        if (tTD.mouseDown != null && tTD.mouseDown == true) {
            tTD.style.cursor = 'default';
            if (tTD.oldWidth + (event.x - tTD.oldX) > 0) tTD.width = tTD.oldWidth + (event.x - tTD.oldX);
            //调整列宽
            tTD.style.width = tTD.width;
            tTD.style.cursor = 'col-resize';
            //调整该列中的每个Cell
            table = tTD;
            while (table.tagName != 'TABLE') table = table.parentElement;
            for (j = 0; j < table.rows.length; j++) {
                table.rows[j].cells[tTD.cellIndex].width = tTD.width;
            }
        }
    };
}
table.οnmοuseup=function(){
	//结束宽度调整
	if (tTD == undefined) tTD = this;
	tTD.mouseDown = false;
	tTD.style.cursor = 'default';
};

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值