在进行前端显示设计时，传统的方法是以分页显示，逐条提取后修改及保存，非常不利于用户连贯阅读及在线修改。因此，本人将类似excel的一些table表格在线卷动显示、修改及集中保存功能进行了尝试，封装成了一个纯js控件，只通过一句代码进行调用，将数据库查询结果集进行显示和添加、修改后集中返回json集进行保存，达到节约时间和连贯操作的目的。
其实功能如下：
一、本控件设计封装了一个纯javascript表格显示js类控件，可以直接接口mysql数据库结果集查询，调用只需一行语句。控件具有自定义显示颜色、自定义显示宽高、类似excel上下左右滚动翻页、按字段排序、选择、修改、添加、插入、删除、鼠标调整列宽、双击(按空格键)直接编辑、自动返回编辑json数据，一键导出excel、自适应显示等功能。为力求网页下载简单方便快速，没有加入华丽图片背景(可后期叠加)，全调用只有一个文件，js压缩下来只43k。
二、tableshow控件为纯js编写，只有一个tableshow.min.js文件，只需一行调用代码即可。
三、为了便于用户操作使用，说明tableshow使用方法和注意事项，在控件中，在多处进行了操作使用帮助及提示，点击表格的“操作-帮助”即可显示帮助信息。
可以进行的编辑操作功能如下：
1.按各标题进行排序,点击标题栏对应列即可按该列标题名称进行排序;
2.可以直接对单元格进行编辑，在选中单元格条件下(选中中单元格变蓝色)，可以通过点右侧“编辑按钮”,或者双击单元格，或者按键盘Enter键三种方式下进入单元格编辑状态(连续三种方式操作会进入多文字编辑状态，此时编辑框会扩展);
3.处于编辑状态或选择状态时，当点两个其他单元格，将退编辑状态，或者按“Esc”也将退编辑及选择状态;
4.当对某行的单元格有实现修改动作后，该行颜色会变成红色，另外最后一行默认添加的显示“待填”的行，也会显示红色，表示需要进入修改输入，当输出上传时，所以红色行在“只对修改”保存方式下都会进行保存输出;
5.选择打勾功能，在第一个标题“序号”下，当点击黑色下三角图形时就会进入“全选、全不选、反选和重写序号”功能面板;
6.在各主要操作功能界面，当鼠标放置2秒以上，就会显示各功能具体操作介绍;
7.输出前请选择保存方式，输出是按保存方式进行下载后，用excel或wps打开时会有提示文件损坏信息，不用管它，点“是”打开就行;
8.当将鼠标放于标题分界坚线或序号列下分界线时，鼠标会变成可以左右拉动或上下拉动的形状，此时可以按下左键不放情况下对单元格宽度进行调整，以便显示出隐藏的文字;
9.默认情况下，表格为紧凑显示方式，此时全部列自动缩在显示框内，没有水平滚动条，当改选全展型时，为所有列根据列内容大小全部显示，隐藏部分可通过水平滚动条展示;
10.当某行有修改时，该行颜色为红色，当选择“只对修改”方式时，只保存输出红颜色行,当选择方式为“选择打勾”方式时，按行前打勾行数进行保存输出,选择“全部覆盖”时，全部行数保存输出;
11.当处于编辑状态时，操作Home区四个键可以上下左右移动编辑单元格，按“Delete”移到左边单元格进行编辑，按“PageDown”移到右边单元格进行编辑，按“Home”移到上面单元格进行编辑,按“End”移到下面单元格进行编辑;
12.可通过在标题栏右键时(作用于点击位标题处)，调出标题编辑面板，可对标题进行“增、删、改”操作，对于设计空表或修改已存表都有积极作用;
13.当鼠标停留在某一行时，点鼠标右键将弹出面板，可对当前行进行上下移动、复制、粘贴及主键重复检查(对数据库，主键作为索引是唯一的，不允许重复)。