晗旭这个小伙子 2018-12-25 11:07
浏览 1056

bootstrapTable显示混乱

使用bootstrapTable时,发生了按钮和文字显示混乱的问题。图片说明

在Chrome环境运行,console上没有任何问题。
html页面如下

 <div id="toolbar" class="btn-group" style="margin-top:15px">
            <button id="btn_add" type="button" class="btn btn-default">
                <span class="glyphicon glyphicon-plus" aria-hidden="true"></span>新增
            </button>
            <button id="btn_edit" type="button" class="btn btn-default">
                <span class="glyphicon glyphicon-pencil" aria-hidden="true"></span>修改
            </button>
            <button id="btn_delete" type="button" class="btn btn-default">
                <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>删除
            </button>
        </div>
        <div><table id="data-table"></table></div>

js页面如下

$('#data-table').bootstrapTable({

         toolbar:"#toolbar",
         striped: true,                      //是否显示行间隔色
         cache: false,                       //是否使用缓存,默认为true,所以一般情况下需要设置一下这个属性(*)
         pagination: true,                   //是否显示分页(*)
         sortable: false,                     //是否启用排序
         sortOrder: "asc",                   //排序方式

         sidePagination: "server",           //分页方式:client客户端分页,server服务端分页(*)
         pageNumber:1,                       //初始化加载第一页,默认第一页
         pageSize: 10,                       //每页的记录行数(*)
         pageList: [10, 25, 50, 100],        //可供选择的每页的行数(*)
         search: true,                       //是否显示表格搜索,此搜索是客户端搜索,不会进服务端,所以,个人感觉意义不大
         strictSearch: true,
         showColumns: true,                  //是否显示所有的列
         showRefresh: true,                  //是否显示刷新按钮
         minimumCountColumns: 1,             //最少允许的列数
         clickToSelect: true,                //是否启用点击选中行
         height: 500,                        //行高,如果没有设置height属性,表格自动根据记录条数觉得表格高度
         uniqueId: "ID",                     //每一行的唯一标识,一般为主键列
         showToggle:true,                    //是否显示详细视图和列表视图的切换按钮
         cardView: false,                    //是否显示详细视图
         detailView: false,                   //是否显示父子表
         columns: [{
             checkbox: true
         },{
             field: 'id',
             title: 'Item ID'
         }, {
             field: 'name',
             title: 'Item Name'
         }, {
             field: 'price',
             title: 'Item Price'
         }],
         data: [{
             id: 1,
             name: 'Item 1',
             price: '$1'
         }, {
             id: 2,
             name: 'Item 2',
             price: '$2'
         }]

});
  • 写回答

0条回答

    报告相同问题?

    悬赏问题

    • ¥15 delta降尺度计算的一些细节,有偿
    • ¥15 Arduino红外遥控代码有问题
    • ¥15 数值计算离散正交多项式
    • ¥30 数值计算均差系数编程
    • ¥15 redis-full-check比较 两个集群的数据出错
    • ¥15 Matlab编程问题
    • ¥15 训练的多模态特征融合模型准确度很低怎么办
    • ¥15 kylin启动报错log4j类冲突
    • ¥15 超声波模块测距控制点灯,灯的闪烁很不稳定,经过调试发现测的距离偏大
    • ¥15 import arcpy出现importing _arcgisscripting 找不到相关程序