bootstrap 可以拖动表格宽度_table表格列宽可拖动

table

编号	姓名	性别	生日	民族
001	test	001	1989-03-06	汉

//用来存储当前更改宽度的Table Cell,避免快速移动鼠标的问题

var tTD;

var table = document.getElementById("tableWidth");

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宽度

//table = tTD; while (table.tagName != ‘TABLE') table = table.parentElement;

//tTD.tableWidth = table.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.width = tTD.tableWidth + (tTD.offsetWidth – tTD.oldWidth);

//table.style.width = table.width;

}

};

}

bootstrap 可以拖动表格宽度_table表格列宽可拖动相关推荐

bootstrap 可以拖动表格宽度_word表格技巧：如何快捷调整表格
有人曾经说过这么一句话:复杂的表格Excel做,简单的表格Word做.例如:个人简历.日程表.工作安排.请假单等等一些简单的表格,一般都会首选Word来制作完成. 但是,要想制作出符合心意的Word表 ...
excel表格行宽列高怎么设置_excel表格怎么设置行高列宽
excel表格怎么设置行高列宽你是怎么调整Excel表格的行高和列宽的? 如果还在用原始的手动调整方法,那你赶紧看看下面这几种解决方法,不仅效率高,而且调整的行高和列宽还很统一整齐哦,快和小编来学习 ...
poi-tl导出word；自定义列表序号和表格宽度，表格合并，自定义标题，更新目录
文章目录 poi-tl 入门示例 1.准备word模板 2.代码自定义列表序号 1. poi-tl 支持的序号列表,直接使用文档种说明即可 2. 要是没有,可以利用NumberingFormat类去 ...
excel 复制格式不变_ 如何复制Excel表格保持格式及列宽不变
excel 复制格式不变_ 如何复制Excel表格保持格式及列宽不变 == excel 粘贴的时候,经常格式就乱了,我们想要保持原来的样式. 有的之后粘贴后,右下角有个图标可以选择保留原格式. ...
antd table 宽度_table固定列的宽度,超出部分用…代替(针对普通table和antd)
一. 实现思路我们都知道让溢出内容变成...,只需要以下: overflow: hidden; text-overflow:ellipsis; white-space: nowrap; 表格里的内容 ...
html设置表格行高和列宽,怎么在腾讯文档中设置表格的行高和列宽
摘要腾兴网为您分享:怎么在腾讯文档中设置表格的行高和列宽,云集,虚拟机,我的世界,卫星云图等软件知识,以及cad2009,kmp,mt4,usb转串口驱动,wifi吸粉,csgo动态组名,亿方云,单 ...
如何以厘米为单位精确设置Excel表格的行高列宽？
转载自品略图书馆 http://www.pinlue.com/article/2020/03/2714/4610059349259.html 各位朋友,大家好. 先普及下在excel里面行高和列宽的 ...
easyui datagrid 浏览器像素及改变表、列宽问题
转载以下文章时我还没有很深的研究easyui,现在回过头来看看,有点弱,如今easyui的1.3.1版本都出来了,下面的东西可以使用"fit:true"属性来解决 ======== ...
layui控制table列长度_layui表头宽度和表格一致_天天都要用的10个word表格技巧，工作再忙都要学会！！......
Hello,各位叨友们好呀!我是叨叨君~ 说起制作表格可不是Excel的专利,日常工作中,用Word制作表格也是常有的事儿,对于有些小伙伴来说,可能天天都要用,那么,用Word制作表格,有哪些技巧是我 ...
计算机表格设置宽度,word表格大小调整固定单元格大小设置——想象力电脑应用...
在前面的课程中,我们讲解了创建表格(四种创建表格的方法)和表格的基本操作(选择表格.插入与删除行或列.删除单元格.删除整张表格以及合并与拆分单元格)的方法,这里,我们接着介绍表格大小的设置. 当我们创 ...

bootstrap 可以拖动表格宽度_table表格列宽可拖动

bootstrap 可以拖动表格宽度_table表格列宽可拖动相关推荐

最新文章

热门文章

bootstrap 可以拖动 表格宽度_table表格列宽可拖动

bootstrap 可以拖动 表格宽度_table表格列宽可拖动相关推荐

最新文章

热门文章

bootstrap 可以拖动表格宽度_table表格列宽可拖动

bootstrap 可以拖动表格宽度_table表格列宽可拖动相关推荐