jQuery可调整表和列宽插件-colResizable

爱被打了一巴掌 2022-08-21 14:46 207阅读 0赞

### 最基本的例子 ###

#### 引入JS ####

<script src="js/jquery-1.8.0.min.js" type="text/javascript"></script>
    <script src="js/colResizable-1.6.js" type="text/javascript"></script>

#### TABLE ####

<table class="table table-bordered">
    <thead>
        <tr>
           <th>栏目类型</th>
           <th>活动名称</th>
           <th>状态</th>
           <th>操作选项</th>
        </tr>
    </thead>
    <tbody>
        <tr>
           <td>青春日记</td>
           <td>我们一起傻逼的日子</td>
           <td>提交</td>
           <td>审核</td>
        </tr>
        <tr>
           <td>我和孩子的成长故事</td>
           <td>成长故事</td>
           <td>通过</td>
           <td>审核</td>
        </tr>
    </tbody>
    </table>

#### JS ####

<script type="text/javascript">
        $(function() { 
            $("table").colResizable();
        })
    </script>

以上步骤即可实现最简单的鼠标拖动调整表格列宽

在线演示：[colresizable][]

更多信息参考：[http://www.bacubacu.com/colresizable/][http_www.bacubacu.com_colresizable]

作者：[itmyhome][]

[colresizable]: http://blog.itmyhome.com/colresizable/
[http_www.bacubacu.com_colresizable]: http://www.bacubacu.com/colresizable/
[itmyhome]: http://blog.csdn.net/itmyhome1990

发表评论取消回复

表情：

评论列表（有 0 条评论，207人围观）

还没有评论，来说两句吧...

相关阅读

相关基于colResizable-1.6实现一个表头固定、列宽可调的table

colResizable官网：[http://www.bacubacu.com/colresizable/][http_www.bacubacu.com_colresizabl

拼搏现实的明天。/ 2023年06月06日 08:30/ 0 赞/ 123 阅读

相关 php 导出excel 设置列宽,php – 导出Excel文件时调整列宽

您不需要一个巨大的库来导出excel.只需在html文件中使用适当的元数据即可构建几乎正版的excel文件. 您必须在标题中包含以下内容： ... 我实际使用的完整代码是

清疚/ 2023年01月15日 08:26/ 0 赞/ 263 阅读

相关 jQuery可调整表和列宽插件-colResizable

最基本的例子引入JS <script src="js/jquery-1.8.0.min.js" type="text/javascript"></scri

爱被打了一巴掌/ 2022年08月21日 14:46/ 0 赞/ 208 阅读

相关机房收费系统系列三：MSHFlexGrid控件自动调整列宽

MSHFlexGrid控件在学生信息管理系统的时候就用到了，对它也只是简单的认识，机房收费系统中它就基本上成为了主角，合适的列宽，不仅美观，还是给人一种舒适感。认识一个对象，从

清疚/ 2022年08月10日 17:53/ 0 赞/ 356 阅读

相关 C# winform中的DataGridView的列宽设置（自动调整列宽）

更改AutoSizeColumnsMod属性，具体值和功能如下： 1、AllCells 调整列宽，以适合该列中的所有单元格的内容，包括标题单元格。 2、Al

悠悠/ 2022年07月13日 07:51/ 0 赞/ 583 阅读

相关调整Table表格宽度插件colResizable

调整Table表格宽度插件colResizable 引入JS <script src="js/jquery-1.8.0.min.

女爷i/ 2022年06月04日 06:27/ 0 赞/ 529 阅读

相关 jQuery插件：表单jquery.form.js

jQuery插件：表单jquery.form.js jQuery插件：表单jquery.form.js [jquery.form.js 官网][jquery.fo

矫情吗；*/ 2022年06月01日 03:27/ 0 赞/ 239 阅读

相关 POI自动调整列宽错误

描述 POI组装Excel时，使用autoSizeColumn进行自动调整列宽。在Windows环境下输出正常，但是在Linux环境下输出的Excel的列宽错乱，如下图：

妖狐艹你老母/ 2022年04月10日 04:26/ 0 赞/ 565 阅读

相关基于JQuery可拖动列表格插件DataTables的踩坑记

前言最近项目中在使用能够拖动列调整列位置顺序的表格插件---DataTables,这也是目前我找到的唯一一种存在有这种功能的插件。在查找使用方法的过程中发现可用案例并不

r囧r小猫/ 2021年11月09日 01:16/ 0 赞/ 352 阅读

相关 Datatables添加序列列（Jquery插件）

Datables添加序列列定义一个空列： { data: null, targets: 0 } 然后在dataTable

悠悠/ 2021年09月27日 10:12/ 0 赞/ 467 阅读