HandsonTable封装构思

HandsonTable是一个很牛逼的仿Excel的jQuery表格插件。
在做现在这个项目的时候，用原生的HandsonTable可以实现80%左右的需求。然而，第三方的插件毕竟不是为自己的项目定制的，所以在实现某些功能或者效果的时候，感觉比较费劲；而插件所提供的一系列强大的功能又没有派上用场。
当下的考虑是抽空把HandsonTable梳理一下，然后包装一层给我们的项目使用。这样一方面可以踩在巨人的肩膀上，起点较高地往上爬；另一方面，又能因地制宜地把重心集中于我们自己的业务需求上。

当前项目主要业务需求的分析：

1.层级结构展示，以及展开折叠；
2.Dropdown形式的下拉选择编辑；
2.联动编辑（包括纵向联动，横向联动）；
3.“展开到”功能实现；
4.在存在折叠的情况下的联动编辑；
5.去除为展现而增加的html元素后向服务器做请求；
6.拖选控制（精准到列，以及跳过有关联控制的行）；

层级结构展示，展开折叠：

现有实现：

• 在向HandsonTable添加数据的时候，直接将html元素内嵌到表格值中去；
• 向嵌入的html元素添加level之类的class属性（level，level1，level2……，lastLevel等），通过css进行样式控制（主要是margin属性的左边距）；
• 为附加的html元素添加事件，用来做展开折叠；
• 在折叠的时候是通过将折叠数据临时存放到一个以rowNo做索引的二位数组中来实现的，这样可以保证在HandsonTable做滚动加载的时候不会出现留白的现象；

var sectionLevel = 'level' + section.level;
            if ((section.sectionNo == undefined) || (section.sectionNo == '')) {
                sectionObj.code = '<a class="level ' + sectionLevel + '">' + '<i class="iconfont icon-reduce"></i></a>' + section.sequenceNo;
            } else {
                sectionObj.code = '<a class="level ' + sectionLevel + '">' + '<i class="iconfont icon-reduce"></i></a>' + section.sectionNo;
            }

考虑封装：

• 将用来做展开折叠的列封装起来，不在每个包含HandsonTable的页面写这些嵌入html元素的代码，而是由封装的Table控件统一处理；
• 在进行编辑时，移除html元素的处理封装到组件中，并考虑是否能够在显示的时候不闪现html代码；
• 展开折叠使用的hideData全局变量考虑重构，现有实现对于同一页面包含多个Table的情况下有问题；
• 将展开折叠的实现封装到Table控件中，hideData作为Table属性存在；

Dropdown形式的下拉选择编辑：

现有实现：

• 使用HandsonTable的钩子回调事件afterBeginEditing，也就是在一个表格进入编辑状态的时候，在HandsonTable的InputHolder中嵌入一个下拉列表html串，然后将其呈现出来；
• html串自行组装，因此可以按照自己的业务要求来做控制；
• 在下拉列表点击完成之后，将InputHolder自带的Editor销毁，然后移除下拉列表内容；

relationTable.addHook('afterBeginEditing', function (row, col) {
   
        var colProp = this.colToProp(col);
        var cellVal = this.getDataAtCell(row, col);
        var colIndex =