其实这个功能特简单，是我自己想复杂了，翻了很多资料，最后靠运气写出来了~~~写出来后，希望自己也能记住，以后有用到，能第一时间找到，废话不多说，进入正题：
首先展示一下功能：
当columns里的field属性隐藏时：
当columns里的field属性展示时：
js相关代码(展示table的JS)：
function load() { $('#exampleTable') .bootstrapTable( { method : 'get', // 服务器数据的请求方式 get or post url : ctx+prefix + "/list", // 服务器数据的加载地址 // showRefresh : true, // showToggle : true, // showColumns : true, iconSize : 'outline', toolbar : '#exampleToolbar', striped : true, // 设置为true会有隔行变色效果 dataType : "json", // 服务器返回的数据类型 pagination : true, // 设置为true会在底部显示分页条 // queryParamsType : "limit", // //设置为limit则会发送符合RESTFull格式的参数 singleSelect : false, // 设置为true将禁止多选 // contentType : "application/x-www-form-urlencoded", // //发送到服务器的数据编码类型 pageSize : 10, // 如果设置了分页，每页数据条数 pageNumber : 1, // 如果设置了分布，首页页码 //search : true, // 是否显示搜索框 showColumns : false, // 是否显示内容下拉框（选择显示的列） sidePagination : "server", // 设置在哪里进行分页，可选值为"client" 或者 "server" queryParams : function(params) { return { //说明：传入后台的参数包括offset开始索引，limit步长，sort排序列，order：desc或者,以及所有列的键值对 limit: params.limit, offset:params.offset, menu:$("#homeId").val(), menu1:$("#homeId1").val(), menu2:$("#homeId2").val(), name:$("#searchName").val(), email:$("#searchName").val(), // username:$('#searchName').val() }; }, // //请求服务器数据时，你可以通过重写参数的方式添加一些额外的参数，例如 toolbar 中的参数 如果 // queryParamsType = 'limit' ,返回参数必须包含 // limit, offset, search, sort, order 否则, 需要包含: // pageSize, pageNumber, searchText, sortName, // sortOrder. // 返回false将会终止请求 columns : [ /*{ checkbox : true },*/ /*{ field : 'userId', title : '序列号' },*/ { field : 'username', title : '客服名' , formatter : function(value, row, index) { if(row.serverPhotoPath == null){ var url = ''; }else{ var url = 'serverPhotoPath +'">'+' ' +'enterInto("'+row.userId+'")>'+' '+row.username+''; } return url; } }, /*{ field : 'name', title : '全名' }, { field : 'password', title : '密码' }, { field : 'deptId', title : '' },*/ { field : 'email', title : '邮箱' }, /*{ field : 'fixPhone', title : '电话号码' }, { field : 'mobile', title : '手机号' },*/ /*{ field : 'serviceType', title : '客服类型(0：全职；1：临时)', },*/ /*{ field : 'userIdCreate', title : '创建用户id' }, { field : 'gmtCreate', title : '创建时间' },*/ { field : 'deadLine', title : '最后修改时间', hover : function(){ var modified = 'row.gmtModified'; return modified; } }, /*{ field : 'gmtModified', title : '最后修改时间' },*//* { field : 'sex', title : '性别' },*/ /* { field : 'timeZone', title : '时区时间' },*/ /*{ field : 'picId', title : '' }, { field : 'signature', title : '签名' }, { field : 'orderScope', title : '工单范围' }, { field : 'serviceRole', title : '客服角色' }, { field : 'groupAccess', title : '组访问' }, { field : 'duty', title : '职务' },*/ { title : '操作', field : 'id', align : 'center', /* visible: true, width: fixWidth(0.1),*/ formatter : function(value, row, index) { /* var abcds = row.sex; alert(abcds.get(0)); if (abcds ==12){ };*/ /* getCenterJurisdiction(row.sex);*/ var e = ''" href="#" mce_href="#" title="编辑" οnclick="edit(\'' + row.userId + '\')"> '; var d = ''" href="#" title="删除" mce_href="#" οnclick="remove(\'' + row.userId + '\')"> '; var g = ''" href="#" title="恢复删除" mce_href="#" οnclick="recovery(\'' + row.userId + '\')"> '; var f = ''" href="#" title="备用" mce_href="#" οnclick="resetPwd(\'' + row.userId + '\')"> '; return e + d + g ; } } ] }); }
js相关代码(点击动态卡显示判断条件展示想对应的columns里的field属性)：
function getFullTime(){ $('#exampleTable').bootstrapTable('showColumn', 'id'); $('#homeId1').val(4); $('#homeId2').val(4); $('#homeId').val(0); reLoad(); s_recovery_h = 'hidden'; s_edit_h = ''; s_remove_h = ''; }
$('#exampleTable').bootstrapTable('showColumn', 'id');就是展示操作属性
js相关代码(初始化隐藏对应的columns里的field属性)：
$(function() { load(); $('#exampleTable').bootstrapTable('hideColumn', 'id'); s_recovery_h = 'hidden'; s_edit_h = 'hidden'; s_remove_h = 'hidden'; $('[data-toggle="tooltip"]').tooltip(); });
$('#exampleTable').bootstrapTable('hideColumn', 'id');就是隐藏操作属性
是不是贼简单~~~~~~~作为后台的我表示很羞愧啊