js为table列宽度添加拖拽调整

 

//var table = document.getElementById("table1");
//addResize($(".layui-table")[0]);

/** Table添加列宽度调整 */
function addResize(table) {

    var td;
    var mousedown = function (event) {
        td = this;
        if (event.offsetX > td.offsetWidth - 10) {
            td.mouseDown = true;
            td.screenX0 = event.screenX;
            td.oldWidth = td.offsetWidth;
        }
        //console.log("onmousedown():" + event.screenX);
    };

    var mouseup = function (event) {
        if (td == undefined) td = this;
        td.mouseDown = false;
        td.style.cursor = 'default';
        //console.log("onmouseup():" + event.screenX);
    };

    var mousemove = function (event) {

        //更改鼠标样式
        if (event.offsetX > this.offsetWidth - 10)
            this.style.cursor = 'col-resize';
        else
            this.style.cursor = 'default';

        //调整宽度
        if (td == undefined) td = this;
        if (td.mouseDown != null && td.mouseDown == true) {

            if ((event.screenX - td.screenX0) != 0) {
                td.style.cursor = 'col-resize';

                td.width = td.oldWidth + (event.screenX - td.screenX0);
                td.style.width = td.width;
                //table.rows[0].cells[td.cellIndex].style.width = td.width
                //console.log("onmousemove():" + event.screenX);
            }
        }
    };

    // 修改表头列宽度信息	
    var cells = table.rows[0].cells;
    for (j = 0; j < cells.length; j++) {
        var cell = cells[j];
        cell.onmousedown = mousedown;
        cell.onmouseup = mouseup;
        cell.onmousemove = mousemove;
    }
}