先放一个效果图：
引用什么js.Css文件大家都知道，不清楚的可以看我的另一篇博客bootStrap table简单使用，直接放js,看重点吧!!!
js:
//初始化Table
oTableInit.Init = function () {
$('#tb_formalJob').bootstrapTable({
url: httpRequestUrl + '/adminEntArea/jobInfo/queryJobList', //请求后台的URL（*）
ajaxOptions: {
crossDomain: true,
"headers": {
"content-type": "application/json",
"replayid": getRandomNumber(),
},
"xhrFields": {
"withCredentials": true
},
},
method: 'post', //请求方式（*）
// contentType: "application/x-www-form-urlencoded",
// toolbar: '#toolbar', //工具按钮用哪个容器
striped: true, //是否显示行间隔色
cache: false, //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
pagination: true, //是否显示分页（*）
sortOrder: "asc", //排序方式
queryParamsType: '',
paginationShowPageGo: true,
showJumpto: true,
pageNumber: 1, //初始化加载第一页，默认第一页
queryParams: queryParams,//请求服务器时所传的参数
sidePagination: 'server',//指定服务器端分页
pageSize: 1,//单页记录数
pageList: [10, 20, 30, 40],//分页步进值
search: true, //是否显示表格搜索，此搜索是客户端搜索，不会进服务端，所以，个人感觉意义不大
silent: true,
showColumns: true, //是否显示所有的列
showRefresh: true, //是否显示刷新按钮
minimumCountColumns: 2, //最少允许的列数
uniqueId: "formalJobId", //每一行的唯一标识，一般为主键列
columns: [{
checkbox: true
}, {
field: 'jobName',
title: '职位名称',
align: 'center',
}, {
field: 'releaseTime',
title: '发布时间',
align: 'center'
}, {
field: 'expiredTime',
title: '截至时间',
align: 'center'
}, {
field: 'operation',
title: '操作',
align: 'center',
events: operateEvents,//给按钮注册事件
formatter: addFunctionAlty//表格中增加按钮
}], // 得到查询的参数
function queryParams(params) {
var temp = { //这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的
pageNum: params.pageNumber,
pageSize: params.pageSize,
jobType: jobType,
isExpired: isExpired
};
return temp;
};注意注意！！！！！！！！！！！！！！！！！！
后台返回的数据格式一定得是这样的！！！！不然没法分页
{
rows:data, //存放的是后台返回的数据
total:total //存放的是总的数据条数
}