拖动引导表列宽的方法

在之前做过的一个web项目中，前端表是基于jQuery和Bootstrap Table的，客户要求可以通过拖动来改变列宽。对于总结和备忘录，实施过程记录如下：

1.可以拖动引导表，并且需要它的可调整大小的扩展。有关详细信息，请参见引导表的官方文档链接：http://bootstrap-table.wenzhixin.net.cn/zh-cn/extensions/

进入后找到Resizable插件，点击Home进入github找到详细用法。

2.用法是直接介绍js插件，但是可以看到这个插件也依赖于colResizable v1.6(下载地址：http://www.bacubacu.com/colresizable/)

script src=' http : colresizable-1.6 . min . js '/script script src=' http : extensions/bootstrap-table-resizable . js '/script 3。另外，在使用Bootstrap Table时，建议使用js来设置Table的列属性，即如下：

$('#myTable ')。bootstrapTable({ url: url，method: 'post '，column 3360[{ align: 'center '，checkbox:true，width:'15 '，Valign:' middle'}，{field:' name '，title :' name '，align : ' center '，width :' 100 '，valign : ' middle ' }，{ field 333333330这样，可以通过修改宽度的大小来直接修改列的宽度。还有一种在HTML中设置表格列标题的方法。这种方式很难调整宽度，容易导致列标题与内容错位，不推荐使用。例如：

第一个数据字段=' id '数据宽度=' 50px '否。/第th个数据字段=' name '数据-宽度=' 100px '名称/第th个数据字段=' desc '数据-宽度=' 120px '描述/th/tr/d摘要

以上是边肖介绍的Bootstrap Table列宽拖动方法。希望对大家有帮助。如果你有任何问题，请给我留言，边肖会及时回复你。非常感谢您对我们网站的支持！