jQuery表格列宽可拖拽调整

表格的列宽拖着就能调，这种功能在管理后台里用得多。用jQuery实现其实不复杂，逻辑也挺清楚：监听鼠标事件，动态改列宽就行了。如果你不想从头撸代码，也可以用现成的插件，比如colResizable、resizableColumns这种，配置少，效果还挺顺滑的。

表头的元素是主要操作对象，一般用$('table thead th')之类的选择器就能抓到。给它们绑上mousedown，记录鼠标位置和原始宽度，mousemove里算出偏移量实时改列宽，mouseup收尾。整个过程核心就是监听事件 + 调样式，别忘了event.preventDefault()防止误触文本选中。

想做得更高级一点？可以加上animate()让变化更丝滑，或者用data()方法保存原始宽度，做后续数据更方便。浏览器兼容性也要注意，尤其是老版本 IE，搞不定就加个兼容判断或者直接劝退。

插件的话，推荐你看看colResizable，也可以试试resizableColumns。如果你用的是 DataTables，也支持类似功能，直接开启配置项就行，省心省力。

如果你表格列比较多，记得考虑下性能，建议用事件委托优化一下，别一个个绑事件，费资源。还有，最好加个拖动标识，比如右边加个小把手，用户操作起来也直观点。

，jQuery搞表格列宽拖动还是挺顺手的。逻辑简单、效果。如果你刚好有后台需求，不妨试试看，调起来蛮爽的。