bootstrap 固定最底部_BootstrapTable固定头和底部

版本选择

采用的bootstrapTable样式与js的版本是1.15.4，采用比较低的版本会在有滚动条的情况下，表格不对齐

需要引用的CSS与js

客户名称其他名称9月09 星期一9月09 星期二9月09 星期三9月09 星期四9月09 星期五9月09 星期六9月09 星期日本周累计

// data是json/data1.js引入的数据

var data;

function totalTextFormatter() {

return '总计'

}

// 统计函数

function totalFormatter(data) {

console.log(data)

data = data

var field = this.field;

return data.map(function(row) {

return +row[field]

}).filter(function(item) {

return !window.isNaN(item);

}).reduce(function(sum, i) {

return sum + i

}, 0)

}

$(function() {

$('#tableTest1').bootstrapTable({

//sortable: true,

//height: $(window).height() - 250,

data: data,

height: 300,

showFooter: true,

onSearch: function() {}

});

$('#tableTest1').bootstrapTable("resetView")

// 没有数据的情况下删除统计行

setTimeout(function() {

//console.log($(".fixed-table-body tbody tr:not(.no-records-found)").length)

if ($(".fixed-table-body tbody tr.no-records-found").length) {

$(".fixed-table-footer").remove()

//$(".fixed-table-footer").css("visibility","hidden")

$(".fixed-table-body").css({ "border": "1px solid #ccc", "border-top": "none" })

$(".fixed-table-border").css("border", "none")

}

}, 50)

})

注意：初始化bootstrapTable后再执行$('#tableTest1').bootstrapTable("resetView") ，避免表格线条不对齐。