最近突然想自定义页脚的显示内容，把一些统计结果放进页脚显示。在网上找到一个方法，试了一下他的思路，成功了，感谢大神。
bootstrap-table.min.js总归就是一个js文件，可以在这里面适当修改。
将方法大致记录一下。
在开始之前，先说一下，如果在你的网页中，导入了bootstrap的中文包，即bootstrap-table-zh-CN.js，要先把他注释掉，不然你怎么修改都不会有变化。
一、反推其实现的过程
利用谷歌浏览器或者360浏览器，一步步剥开外衣，最后会发现以下内容：
这里的内容是我已经修改了以后显示的，可以看见，我给他添加了一个时间的统计。
在这里可以看见，有一个叫”pagination-detail”的class属性，找到线索了。下一步，去bootstrap-table.min.js里找这个东西，怎么搜索我就不多说了。
会搜索到以下内容，不同版本的bootstrap，可能不太一样，大同小异：
var m = n.onlyInfoPagination ? n.formatDetailPagination(n.totalRows) : n.formatShowingRows(this.pageFrom, this.pageTo, n.totalRows,n.totalNotFiltered);
if (p.push("<div class=\"".concat(this.constants.classes.pull, "-").concat(n.paginationDetailHAlign, " pagination-detail\">\n <span class=\"pagination-info\">\n ").concat(m, "\n </span>")), !n.onlyInfoPagination) {
……
｝
分析这附近的代码，你会发现，有一个叫formatShowingRows的函数至关重要。
接着搜索这个函数，能找到这个函数的结构。如下：
formatShowingRows: function(e, t, o,n) {
return void 0 !== n && 0 < n && n > o ? "Showing ".concat(e, " to ").concat(t, " of ").concat(o, " rows (filtered from ").concat(n, " total rows)"): "Showing ".concat(e, " to ").concat(t, " of ").concat(o, " rows")
},
没错，就是这里了，找到了。就是需要改这一部分内容。
通过分析上面两部分代码，我们可以发现，我们可以依样画葫芦，以现有的n.totalRows参数作为样本，将我们需要的参数添加进去。
通过搜索totalRows，经过分析流程，可以大概知道，他是这么生效的。
二、正推其实现流程
1、首先是定义这个变量：
paginationLoop: !0,
sidePagination: "client",
totalRows: 0, //看这
totalTimes: 0,
totalNotFiltered: 0,
２、然后是定义一个从后台接收传过来的值的变量：
totalField: "total", //看这
totalNotFilteredField: "totalNotFiltered",
dataField: "rows",
３、然后是将这个接收传值的变量，赋值给显示用的变量：
{
key: "load",
value: function(e) {
var t = !1,
o = e;
this.options.pagination && "server" === this.options.sidePagination && (this.options.totalRows = o[this.options.totalField]), //看这里
this.options.pagination && "server" === this.options.sidePagination && (this.options.totalNotFiltered = o[this.options.totalNotFilteredField]),
t = o.fixedScroll,
o = Array.isArray(o) ? o: o[this.options.dataField],
this.initData(o),
this.initSearch(),
this.initPagination(),
this.initBody(t)
}
},
4、这个时候，totalRows已经获得了从后台传回来的相关的数据，下一步就是显示，显示则通过之前说的那个函数：
var m = n.onlyInfoPagination ? n.formatDetailPagination(n.totalRows) : n.formatShowingRows(this.pageFrom, this.pageTo, n.totalRows,n.totalTimes, n.totalNotFiltered);
下面是这个函数的具体实现，实现里，这个o，就是 n.totalRows。
formatShowingRows: function(e, t, o,n) {
return void 0 !== n && 0 < n && n > o ? "Showing ".concat(e, " to ").concat(t, " of ").concat(o, " rows (filtered from ").concat(n, " total rows)"): "Showing ".concat(e, " to ").concat(t, " of ").concat(o, " rows")
},
好了，现在
三、添加我们需要的参数
根据第二部分的内容，我们将我需要的参数添加进去：
１、添加接收后台传值的参数
后台怎么传值过来，就不说了，这是controller的内容了。就跟传rows和total一模一样
totalField: "total",
totalNotFilteredField: "totalNotFiltered",
dataField: "rows",
totalTimesld: "mTimes", //这就是我添加的内容
2、添加用来显示的参数
paginationLoop: !0,
sidePagination: "client",
totalRows: 0,
totalTimes: 0, //这个就是用来显示的参数，初始值是０
3、将传过来的值赋值给显示的参数
{
key: "load",
value: function(e) {
var t = !1,
o = e;
this.options.pagination && "server" === this.options.sidePagination && (this.options.totalRows = o[this.options.totalField]),
this.options.pagination && "server" === this.options.sidePagination && (this.options.totalNotFiltered = o[this.options.totalNotFilteredField]),
this.options.totalTimes=o[this.options.totalTimesld], //看这里
t = o.fixedScroll,
o = Array.isArray(o) ? o: o[this.options.dataField],
this.initData(o),
this.initSearch(),
this.initPagination(),
this.initBody(t)
}
},
4、修改formatShowingRows函数，添加你所需要的函数
我顺便还做了一个判断，非空显示。m就是我给totalTimes留出的位置。
formatShowingRows: function(e, t, o,m, n) {
if(null!=m){
return void 0 !== n && 0 < n && n > o ? "Showing ".concat(e, " to ").concat(t, " of ").concat(o, " rows (filtered from ").concat(n, " total rows) and ").concat(m, " hours"): "Showing ".concat(e, " to ").concat(t, " of ").concat(o, " rows and ").concat(m, " hours")
}else{
return void 0 !== n && 0 < n && n > o ? "Showing ".concat(e, " to ").concat(t, " of ").concat(o, " rows (filtered from ").concat(n, " total rows)"): "Showing ".concat(e, " to ").concat(t, " of ").concat(o, " rows")
}
},
5、使用formatShowingRows函数。
没有截取上下文，自行分析吧。
var m = n.onlyInfoPagination ? n.formatDetailPagination(n.totalRows) : n.formatShowingRows(this.pageFrom, this.pageTo, n.totalRows,n.totalTimes, n.totalNotFiltered);
四、处理中文显示，修改bootstrap-table-zh-CN.js
上面的修改结束以后，是英文显示的，如果这个时候导入中文包，后面的内容就又没了。因此，需要对中文包的内容也进行修改。修改bootstrap-table-zh-CN.js。
在中文包中，也有一个叫formatShowingRows的函数，只需要对这类进行修改就行。搜索formatShowingRows。懒得解释了，直接上代码。
formatShowingRows: function formatShowingRows(pageFrom, pageTo, totalRows,totalTimes, totalNotFiltered) {
if (totalNotFiltered !== undefined && totalNotFiltered > 0 && totalNotFiltered > totalRows) {
if(totalTimes!=null){
return "\u663E\u793A\u7B2C ".concat(pageFrom, " \u5230\u7B2C ").concat(pageTo, " \u6761\u8BB0\u5F55\uFF0C\u603B\u5171 ").concat(totalRows, " \u6761\u8BB0\u5F55\uFF08\u4ECE ").concat(totalNotFiltered, " \u603B\u8BB0\u5F55\u4E2D\u8FC7\u6EE4\uFF09，总计 ").concat(totalTimes, " 小时");
}else{
return "\u663E\u793A\u7B2C ".concat(pageFrom, " \u5230\u7B2C ").concat(pageTo, " \u6761\u8BB0\u5F55\uFF0C\u603B\u5171 ").concat(totalRows, " \u6761\u8BB0\u5F55\uFF08\u4ECE ").concat(totalNotFiltered, " \u603B\u8BB0\u5F55\u4E2D\u8FC7\u6EE4\uFF09");
}
}
if(totalTimes!=null){
return "\u663E\u793A\u7B2C ".concat(pageFrom, " \u5230\u7B2C ").concat(pageTo, " \u6761\u8BB0\u5F55\uFF0C\u603B\u5171 ").concat(totalRows, " \u6761\u8BB0\u5F55,总计 ").concat(totalTimes, " 小时");
}else{
return "\u663E\u793A\u7B2C ".concat(pageFrom, " \u5230\u7B2C ").concat(pageTo, " \u6761\u8BB0\u5F55\uFF0C\u603B\u5171 ").concat(totalRows, " \u6761\u8BB0\u5F55");
}
},
结束。
最后感谢一下引用文章，贴在这里。
BootstrapTable 自定义页脚-footer
