一种拓展jQuery表格插件功能的方法与流程

技术特征：
1.一种拓展jquery表格插件功能的方法，其特征在于，包括以下步骤：a)在jquery表格的html页面，搭建表格；b)在html页面设置列按钮；c)添加按钮控件；d)将datatable与表格进行绑定；e)重写datatable的javascript和层叠样式表。2.根据权利要求1所述的一种拓展jquery表格插件功能的方法，其特征在于，所述步骤a中表格包括表头和表格内容；所述步骤b中列按钮与表头顺序相同、内容相同。3.根据权利要求2所述的一种拓展jquery表格插件功能的方法，其特征在于，所述步骤c中按钮控件包括列的显示按钮、列的隐藏按钮、表格列数据显示折行按钮、设置表格显示顺序按钮和设置表格列宽度按钮。4.根据权利要求3所述的一种拓展jquery表格插件功能的方法，其特征在于，所述步骤d的详细步骤为：调用datatable的javascript和层叠样式表，与表格的id进行绑定。5.根据权利要求4所述的一种拓展jquery表格插件功能的方法，其特征在于，所述步骤e的详细步骤为：e1)添加获取cookie的方法；e2)添加设置cookie的方法；e3)添加表格列的初始化方法；e4)添加与步骤c中的按钮控件相对应的执行功能函数；e5)当执行完步骤e3中添加的表格列的初始化方法后，执行步骤c，并将步骤c中添加的按钮控件与相对应的执行功能函数进行绑定。6.根据权利要求5所述的一种拓展jquery表格插件功能的方法，其特征在于，所述执行功能函数包括：列的显示与隐藏的执行功能函数、表格列数据显示折行的执行功能函数、表格显示顺序的执行功能函数和设置表格列宽度的执行功能函数。7.根据权利要求6所述的一种拓展jquery表格插件功能的方法，其特征在于，添加列的显示与隐藏的执行功能函数的具体步骤如下：e4.1)获取表格对象、表格id和模态框顶级<div>的id；e4.2)对获取的模态框顶级<div>的id绑定click事件；e4.3)获取列的接口对象，根据当前列的显隐状态做出判断：如果列的状态为显示，则添加对应的层叠样式表和class，并更改状态；如果列的状态为隐藏，则删除对应的层叠样式表和class，并更改状态；e4.4)将步骤e4.1中获取的模态框顶级<div>的id和e4.3中的列的显隐状态存入数组。8.根据权利要求6所述的一种拓展jquery表格插件功能的方法，其特征在于，添加表格列数据显示折行的执行功能函数的具体步骤如下：e4.5)获取表格列显示的<li>标签，将<li>标签与按钮控件的状态进行绑定；e4.6)点击表格列数据显示折行按钮，传递标识值；当选择折行时，传递的标识值为1，此时为每列单元格添加如下层叠样式表属性：“text
‑
overflow”：“ellipsis”，“white
‑
space”：“pre
‑
wrap”；当选择不折行时，传递的标识值为0，此时为每列单元格添加如下层叠样式表属性：“text
‑
overflow”：“inherit”，“white
‑
space”：“nowrap”。
9.根据权利要求6所述的一种拓展jquery表格插件功能的方法，其特征在于，添加设置表格显示顺序的执行功能函数的具体步骤如下：e4.7)获取表格列显示的<li>标签，将<li>标签与按钮控件的状态进行绑定；e4.8)获取表格中的所有列的<div>的id，并设置对应列的按钮；e4.9)将对应列的按钮与步骤e4.8获取的id绑定，并设置相关层叠样式表，实现拖动相关列，并将顺序存入相应的数组中；e4.10)添加获取每一列宽度的函数方法；e4.11)保存e4.9中列的顺序，调用e4.10中添加的函数方法和调用e2中添加的设置cookie的方法，将cookie的value值与id一一对应。10.根据权利要求6所述的一种拓展jquery表格插件功能的方法，其特征在于，添加设置表格列宽度的执行功能函数的具体步骤如下：e4.12)获取表格列显示的<li>标签，将<li>标签与按钮控件的状态进行绑定；e4.13)获取表格中的所有列的<div>的id，并设置对应列的按钮；并为每一列添加input；e4.14)将步骤e4.13的列宽度储存到数组中，并将数组传入并调用步骤e4.10中添加的函数和步骤e2中添加设置cookie的方法中。

技术总结
本发明公开了一种拓展jQuery表格插件功能的方法，涉及表格高级交互的技术领域，具体包括以下步骤：首先在jQuery表格的html页面，搭建表格，然后在html页面设置列按钮；然后添加多个按钮控件，进而将datatable与表格进行绑定，最后重写datatable的JavaScript和层叠样式表；以实现点击不同的按钮，可实现不同的扩展功能；本发明，使得使用者可以在页面上，通过点击按钮的方式，根据实际使用需求，灵活修改表头的显隐、显示顺序、设置每一列的显示宽度和显示各单元格全部数据。度和显示各单元格全部数据。度和显示各单元格全部数据。


技术研发人员：李琦 张伟 廖涛 钟洋 张聪 李飞
受保护的技术使用者：中电科蓉威电子技术有限公司
技术研发日：2021.09.18
技术公布日：2021/12/3