最近公司使用的是bootstraptable ，在这个过程中使用的冻结列，但是添加了冻结列之后，原本表格自带的checkbox无法使用，导致大部分功能失效，在网上查了很多的资料，最后找到一个办法：
  1. 你得理解冻结列的原理，冻结列实现的原理就是使用的表格复制，将原本的表格复制到上一层，自然新的一层的表格自带效果自然也就不起作用了，因为它失去了原本的事件绑定事件，所以自然复制的checkbox想通过原本的bootstraptable的getSellection 是不可能的，也就是说想使boot自带的getSelection 我们就要激活隐藏在上一层表格中的下一层表格：上源码，这篇文章主要是对冻结列问题，其他bootstrap table 的引入这里就不再赘述。
  • 我主要使用checkbox的选中行，全选功能，已经通过输入选择确定的行，获取当前行的数据，通过网页的元素查看底层的生成表格的class或者name属性，并且对数据进行修改。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
//选中行
   	$('.fixed-table-container').on('click','tbody tr',function(){
   	//添加选中的样式
           $(this).addClass('on').siblings('tr').removeClass('on');
           var tbodys = $(this).parents('.fixed-table-container').find('table tbody')
           var num = $(this).index();
           tbodys.each(function(){
               $(this).find('tr').eq(num).addClass('on').siblings('tr').removeClass('on');
           });
           oTable.ajax.reload();
           oTable1.ajax.reload();
           //获取体检号
           var physicalNum = $.trim($(this).find('td:nth-child(2)').text());
           getAttachTable(physicalNum)

       });

   	//全选
   	$('.fixed-table-container').on('click','input[name="btSelectAll"]',function(){
           if($(this).is(':checked')){
               $('input[name="btSelectItem"]').prop('checked',true);
           }else{
               $('input[name="btSelectItem"]').prop('checked',false);
           }
       })
       //逐个选择
       $('.fixed-table-container').on('click','input[name="btSelectItem"]',function(){
           var inputs = $(this).parents('.fixed-table-body-columns').find('input[name="btSelectItem"]')
           var num = 0;
           inputs.each(function(){
               if($(this).is(':checked')){
                   num++;
               }
           });
           if(num==inputs.length){
               $('input[name="btSelectAll"]').prop('checked',true);
           }else{
               $('input[name="btSelectAll"]').prop('checked',false);
           }
           var index = $(this).parents('tr').index();
           //对底层添加一个点击事件，激活底层的事件
           $('#Table1').find('input[name="btSelectItem"]').eq(index).click();
       });
       
       //选择设置
$("#confirm").click(function(){
	 var begin=parseInt($("#begin").val())-1;
	 var end=parseInt($("#end").val());
       var checks=$(".checkitem")

       var inputs = $(".fixed-table-body-columns").find('input[name="btSelectItem"]');
       var trs = $(".fixed-table-body-columns").find('tr');
       console.log(inputs);
       var num = 0;
     for(var i=begin;i<end;i++){
         num++;
         $(inputs[i]).prop('checked',true);
         $(trs[i]).addClass('on');
             //对底层添加一个点击事件，激活底层的事件
         $('#Table1').find('input[name="btSelectItem"]').eq(i).click();
         
         $('#Table1 tbody').find('tr').eq(i).addClass('on');
     }
       if(num==inputs.length){
           $('input[name="btSelectAll"]').prop('checked',true);
       }else{
           $('input[name="btSelectAll"]').prop('checked',false);
       }
       //var index = $(this).parents('tr').index();
       //$('#Table1').find('input[name="btSelectItem"]').eq(index).click();

	
	 $('#selectSet').modal('hide');
	
});
  • 通过对底层表格添加一个click事件，这样就可以对单个的checkbox通过getSelections也可以获取当前行的元素 。