需要引入的文件：
bootstrapTable基本引入文件：
bootstrap-3.3.4.css、bootstrap-table.min.css、jquery-3.5.1.min.js、bootstrap-3.3.7.min.js、bootstrap-table.min.js
表头调整列宽需要再引入：
colResizable-1.6.js
代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>bootstrapTable表头调整列宽</title>
<link rel="stylesheet" href="./lib/css/bootstrap-3.3.4.css">
<link rel="stylesheet" href="./lib/css/bootstrap-table.min.css">
<script src="./js/jquery-3.5.1.min.js"></script>
<script src="./lib/js/bootstrap-3.3.7.min.js"></script>
<script src="./lib/js/bootstrap-table.min.js"></script>
<script src="./lib/js/colResizable-1.6.js"></script>
</head>
<body>
<table id="table_sortShowNorm"></table>
<script>
$('#table_sortShowNorm').bootstrapTable({
undefinedText: '', // 当数据为undefined时显示的字符，默认是'-'
toolbar: 'false', // 工具按钮用哪个容器
toolbarAlign: 'false', // 工具按钮的位置
striped: false, // 是否显示行间隔色
pagination: false, //是否分页
uniqueId: "tid", // 每一行的唯一标识，一般为主键列
field: 'checked',
checkbox: true,
showColumns: false, // 是否显示列的按钮
// reorderableRows: true, //设置拖动排序
// useRowAttrFunc: true, //设置拖动排序
columns: [{
field: 'checked',
checkbox: true,
}, {
title: '序号',
formatter: function(value, row, index) {
return index + 1;
},
align: 'center'
}, {
field: 'name',
title: '名称',
align: 'center',
cellStyle: {
css: {
"text-align": "center !important"
}
}
}],
data: [{
"name": "wdwdwdd"
}, {
"name": "jdiwjdi"
}],
// responseHandler: function(res) {
// if (res.success) {
// $('#input_cacheId').val(res.data.tid);
// $('#input_modifyTime').val(res.data.modifyTime);
// var data = res.data.treeDto;
// return data;
// } else {
// CommonJS.modal.alertError(res.message);
// }
// return res;
// }
});
$('#table_sortShowNorm').colResizable({
liveDrag: true, //拖动列时更新表布局
gripInnerHtml: "<div class='grip'></div>",
draggingClass: "dragging",
resizeMode: 'overflow' //允许溢出父容器
});
</script>
</body>
</html>