bootstrap-table固定表头，同时适配高度，兼容ie，checkbox，固定列解决方案(续)

bootstrap-table固定表头，同时适配高度，兼容ie，checkbox，固定列解决方案(续)

前文链接：bootstrap-table固定表头，同时适配高度，固定列解决方案

上篇本人对 懒得安分 的技术进行改造，得到的一个初始版js插件，此大神的原文：
JS组件系列——自己动手扩展BootstrapTable的 冻结列 功能：彻底解决高度问题

在实战中，bug频频出现，如兼容性不解决，当点击bootstrap-table的显示隐藏列，会出现画面重叠，也就是原来生成的障眼法的表格不删除，还有就是bootstrap-table的左侧checkbox不能使用。

问题一：兼容性

原来代码：ie下tr.html(′′)会把tds的内容也清空

var $tr = $(this).clone(),$tds = $tr.find('td');$tr.html('');

解决：对其用一个临时变量保存，在清空即可

var $tr1 = $(this).clone(),$tr= $(this).clone(),$tds = $tr1.find('td');$tr.html('');

问题二：画面重叠

原来代码：没有在初始化fixed-column的表前，先对已存在的进行清空，导致每次变化，都会产生新的表格，

BootstrapTable.prototype.initFixedColumns = function () {    if(this.options.leftFixedColumns){

解决：在初始化障眼表格前，对其进行清空

BootstrapTable.prototype.initFixedColumns = function () {    $($.find('.fixed-table-header-columns')).remove();    $($.find('.fixed-table-body-columns')).remove();    if(this.options.leftFixedColumns){

问题三：checkbox固定使用

原来代码：只是对样式等内容进行静态复制，导致点击checkbox没有效果

解决：对原来的checkbox进行伪造的同时，复制原本不固定列时，点击checkbox需要取的值到伪造的checkbox里面，然后通过自己的getValue（）获取选中的checkbox值，小段代码如下：

this.$body.find('tr[data-index]').each(function () {            var index = $(this).data('index');            var tmpData = that.options.data[index].id;            if(that.options.leftFixedColumns){                that.$fixedBody.find('input[data-index="' + index + '"]').val(tmpData);            }            that.$body.find('input[data-index="' + index + '"]').val(tmpData);        });

getValue()函数的代码如下：

function getValue(){    var result=[];    var $tableBody=$('.fixed-table-body-columns');    if($tableBody.length==0){        $tableBody=$('.fixed-table-body').find('table');        var x= $.map($tableBody.bootstrapTable('getSelections'), function (row) {            return row.id             // 想返回什么字段就换成什么            });        return x;    }    if($tableBody.find('input').length==0){        $tableBody=$('.fixed-table-body').find('table').find('tbody');    }    $tableBody.find('input').each(function(){        if ($(this).attr("checked")) {            result.push($(this).val())        }    });    return result;  }

补充css样式代码：

.fixed-table-header-columns,.fixed-table-body-columns {    position: absolute;    background-color: #fff;    display: none;    box-sizing: border-box;    overflow: hidden;}.fixed-table-header-columns .table,.fixed-table-body-columns .table {    border-right: 1px solid #ddd;}.fixed-table-header-columns .table.table-no-bordered,.fixed-table-body-columns .table.table-no-bordered {    border-right: 1px solid transparent;}.fixed-table-body-columns table {    position: absolute;    animation: none;}.bootstrap-table .table-hover > tbody > tr.hover > td{    background-color: #f5f5f5;}

具体的js文件下载链接：
强化版bootstrap-table-fixed-columns.js

欢迎转载，但请声明原处，