--------------------- 
作者：導哥 
來源：CSDN 
原文：https://blog.csdn.net/jingtianyiyi/article/details/76208880 
版權宣告：本文為博主原創文章，轉載請附上博文連結！

1.宣告mergeCells函式 

/**
 * 合併單元格
 * @param data  原始資料（在服務端完成排序）
 * @param fieldName 合併屬性名稱
 * @param colspan   合併列
 * @param target    目標表格物件
 */
function mergeCells(data,fieldName,colspan,target){
    //宣告一個map計算相同屬性值在data物件出現的次數和
    var sortMap = {};
    for(var i = 0 ; i < data.length ; i++){
        for(var prop in data[i]){
            if(prop == fieldName){
                var key = data[i][prop]
                if(sortMap.hasOwnProperty(key)){
                    sortMap[key] = sortMap[key] * 1 + 1;
                } else {
                    sortMap[key] = 1;
                }
                break;
            } 
        }
    }
    for(var prop in sortMap){
        console.log(prop,sortMap[prop])
    }
    var index = 0;
    for(var prop in sortMap){
        var count = sortMap[prop] * 1;
        $(target).bootstrapTable('mergeCells',{index:index, field:fieldName, colspan: colspan, rowspan: count});   
        index += count;
    }
}
 

2.在bootstrapTable的onLoadSuccess函式中載入執行：

onLoadSuccess : function(data) {                                
                var data = $('#table').bootstrapTable('getData', true);
                //合併單元格
                mergeCells(data, "companyTypeName", 1, $('#table'));

},

3.顯示效果

4.boostrap-table部分的回撥函式：

原文：http://www.cnblogs.com/wufanJY/p/7457432.html

分析事件及回撥函式

bootstrap-table事件基本以on繫結，bootstrap-table的事件都有.bs.table字尾 bs即bootstrap 顯然.bs.table是申明boostrap-table。

click-row：行點選事件，callback獲取4個引數 ： e 事件物件 ， row 當前行資料物件 ， ele 當前單元格物件 ， field 當前單元格的field值。(row是資料物件，ele是DOM物件)

dbl-click-row：行雙擊事件，callback獲取4個引數 ： e 事件物件 ， row 當前行資料物件 ， ele 當前單元格物件 ， field 當前單元格的field值。(row是資料物件，ele是DOM物件)

check：單個checkbox選中事件，callback獲取3個引數 ： e 事件物件 ， row 當前行資料物件 ， ele 當前單元格物件。(row是資料物件，ele是DOM物件)

uncheck：單個checkbox取消選中事件，callback獲取3個引數 ： e 事件物件 ， row 當前行資料物件 ， ele 當前單元格物件。(row是資料物件，ele是DOM物件)

check-all：全選checkbox事件，callback獲取2個引數 ：e 事件物件 ，dataArr 選中行資料物件集合(dataArr的物件是資料物件)

uncheck-all：全選checkbox取消事件，callback獲取2個引數 ：e 事件物件 ，dataArr 選中行資料物件集合(dataArr的物件是資料物件)

sort：列排序事件，callback獲取3個引數 ： e 事件物件 ， field 當前列的field值 ， order 當前列是升序還是降序(enum值，desc ， asc)。

load-success：資料載入成功事件，callback獲取2個引數：e 事件物件 ， data 成功載入的資料物件集合。(dataArr的物件是資料物件)

load-error：資料載入失敗事件，callback獲取2個引數：e 事件物件 ， status 失敗狀態碼。

column-switch：顯示隱藏列選擇事件，callback獲取3個引數：e 事件物件 ，field 當前列的field值 ，checked 是否勾選(bool值)。

page-change：翻頁事件，callback獲取3個引數 ： e 事件物件 ，number 當前頁碼(不是下標，是頁碼) ，size 當前頁資料條數。

search：搜尋事件，callback獲取2個引數 ： e 事件物件 ，text 搜尋框輸入內容。

這個demo包含幾乎所有bootstrap-table的事件。

示例程式碼：

$(function(){
            /*初始化表格*/
            $("#goods").bootstrapTable({
                data: data
            });
            /*載入事件*/
            $("#goods")
            .on(‘click-row.bs.table‘, function (e, row, ele,field) {
                $("#eventInfo").text(‘點選行事件 當前商品名：‘+ row.goodsName 
                                    + ‘，價格：‘ + row.price 
                                    + ‘，效期：‘ + row.date
                                    + ‘當前點選單元格field值為：‘ + field);
            })
}