項目組要求搭建一套springboot的開發環境，后端已搭建好，前端用bootstrap，寫好頁面以及js邏輯，啟動發現bootStrapTable方法中的請求未被發送，經多方測試發現bootStrapTable調用必須放在body標簽后面才可以，由此可見該方法必須在整個頁面渲染結束后，即table被bootstrap渲染結束才能被調用。
代碼如下：注意script標簽位置，必須放在body之后
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>歸檔記錄</title>
<link rel="stylesheet" type="text/css" href="/bootstrap/css/bootstrap.css" />
<link rel="stylesheet" type="text/css" href="/bootstrap/bootstrap-table/bootstrap-table.css" />
<script type="text/javascript" src="/jquery/jquery.min.js"></script>
<script type="text/javascript" src="/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="/bootstrap/bootstrap-table/bootstrap-table.js"></script>
<script type="text/javascript" src="/bootstrap/bootstrap-table/locale/bootstrap-table-zh-CN.js"></script>
</head>
<body>
<table id="table" data-toggle="table">
</table>
</body>
<script>
$('#table').bootstrapTable('destroy');
/*$(document).ready(function () {
$.ajax({
type: "POST",
url: "/user/selectAll",
dataType: "json",
data:{pageNum:1,pageSize:10},
success: function (msg) {
$("#table").bootstrapTable('load', msg);
},
error: function () {
alert("錯誤");
}
});
});*/
$('#table').bootstrapTable({
url: "/user/selectAll", //請求后台的URL
method: 'GET', //請求方式
striped: true, //行間隔色
cache: false, //緩存，默認為true，所以一般情況下需要設置一下這個屬性
contentType: 'application/x-www-form-urlencoded',
pagination: true, //分頁
paginationPreText: "上一頁",
paginationNextText: "下一頁",
sortable: false, //排序
sortOrder: "asc", //排序方式
singleSelect: true, //禁止多選
showRefresh: true, //刷新按鈕
showColumns: true, //顯示所有的列
detailFormatter: true,
minimumCountColumns: 3, //最少允許的列數
sidePagination: "server", //分頁方式：client客戶端分頁，server服務端分頁
queryParamsType: 'aaa', // undefined
clickToSelect: true, //是否啟用點擊選中行
queryParams: function (params) { //查詢傳遞參數
var object = new Object();
object.pageNum = params.pageNumber;
object.pageSize = params.pageSize;
return object;
},
idField: 'userId', //指定主鍵列
pageNumber: 1, //初始化加載第一頁，默認第一頁
pageSize: 10, //每頁的記錄行數
pageList: [10, 25, 50, 100], //可供選擇的每頁的行數
checkboxHeader: false,
columns: [{
field: 'userId',
width: '50px',
title: 'id',
align: 'center'
}, {
field: 'userName',
title: '用戶名',
align: 'center'
}, {
field: 'address',
title: '地址',
align: 'center'
},{
field: 'sex',
title: '性別',
align: 'center'
},{
field: 'birthday',
title: '生日',
align: 'center'
}]
});
</script>
</html>