bootstrapTable 列宽设置无效的解决方法之一

摘要: bootstrapTable 列宽设置无效的解决方法之一

小弟是货真价实的后台服务开发人员，结果非要写bootStrap相关的代码，我这个头疼。。。

不过好在有一点点js基础，还能看懂一些代码。结合bootStrap api文档，总算是搞出来了，但，在样式的调整中，列宽不听使唤，实在是郁闷，网上查了很多方案都不行，但发现如果自定义一个列宽函数，是可以实现的。代码如下：

function queryLoanList(){
$('#table').bootstrapTable({
url:'./loan/XXX.json',
sidePagination:'server',
queryParamsType:'pageSize',
queryParams: queryParams,
search:false,
pagination:true,
pageList:[25],
columns : [ {
title : '序号',
align : 'center',
formatter: function (value, row, index) {
return index + 1;
}
},{
field : 'loanId',
halign : 'center',
title : '项目编号'
},{
field : 'loanName',
halign : 'center',
width: 100,
title : '项目名称'
},{
field : 'profitEnterprise',
halign : 'center',
formatter : function(value, row, index){
var div = "<div style='width:240px;'>"+value+"</div>";
return div;
},
title : '合作机构'
},{
field : 'sourceStore',
width:300,
title : '项目来源门店'
},{
field : 'bidType',
title : '项目类型'
},{
field : 'money',
align : 'center',
title : '借款金额(元)'
},{
field : 'loanPeriod',
align : 'center',
title : '借款期限（期）'
},{
field : 'deadLine',
align : 'center',
title : '线下签约期限（期）'
},{
field : 'nowPeriod',
align : 'center',
title : '当前第？期'
},{
field : 'sumMoney',
align : 'center',
title : '每期上扣金额（元）'
},{
field : 'commitRate',
title : '打包结算点位（%）'
},{
field : 'platFormMoney',
align : 'center',
title : '平台分润金额（元）'
},{
field : 'proMoney',
align : 'center',
title : '机构分润金额（元）'
},{
field : 'gmTime',
title : '项目放款时间'
},{
field : 'sourceAgency',
title : '归属上级加盟商'
},{
field : 'treated',
title : '状态'
},{
title : '操作',
formatter : operateFormatter
}]
});
}

其中一句：

formatter : function(value, row, index){
var div = "<div style='width:240px;'>"+value+"</div>";
return div;
},

是关键，他可以自定当前列的div样式。这样就可以强制设置当前列的宽度，不过是定死的，不是自适应的。

以上，是工作中的一些小小收货