Js + Bootstrap Table + adminlte - 自定义formatter，在表格内添加箭头样式，调整列宽

var drawDataTable=function(chartId){    var dataList = [                       {                           "criteria": "q>100",                           "count":   "400 up",                           "cRatio": "10% up",                           "pRatio":  "60% up"

},                       {                          "criteria": "50&lt;q≤100",　　　　　　//<需要转义，否则被视为html标签                          "count":   "400 up",                          "cRatio": "10% up",                          "pRatio":  "60% up"

},{                            "criteria": "10&lt;q&lt;=50",                            "count":   "400 down",                            "cRatio": "10% down",                            "pRatio":  "60% down"

},{                            "criteria": "0&lt;q&lt;=10",                            "count":   "400 down",                            "cRatio": "10% down",                            "pRatio":  "60% down"

},{                             "criteria": "q=0",                             "count":   "400 eq",                             "cRatio": "10% eq",                             "pRatio":  "60% eq"                         }                   ]    $("#" + chartId).bootstrapTable(‘destroy‘).bootstrapTable({        data: dataList，        columns:[            {                field:‘criteria‘,                title:‘物品数量分布‘,                width:"30%"　　　　　　//设置宽度

},            {                field:‘count‘,                title:‘客户数‘,                width:"30%",                formatter: operateFormatter　　　　//自定义样式，传三个参数（value，row, index）,单元格值，行值，索引            },            {                field:‘cRatio‘,                title:‘客户占比‘,                width:"25%",                formatter: operateFormatter            },            {                field:‘pRatio‘,                title:‘物品占比‘,                width:"25%",                formatter: operateFormatter, //自定义方法，添加操作按钮            }        ]    });    }

function operateFormatter(value, row, index){    var arr=value.split(" ")    return arr[0] + arrowStyle(arr[1]);　　//获取自定义箭头样式}function arrowStyle(category){    var temp=‘‘    switch (category){        case "up":            temp=‘<span class="text-green" style="margin-left:10px"><i class="fa fa-long-arrow-up"></i></span>‘            break;        case "down":            temp=‘<span class="text-red" style="margin-left:10px"><i class="fa fa-long-arrow-down"></i></span>‘            break;        case "eq":            temp=‘<span class="text-yellow" style="margin-left:10px;">━</span>‘            break;        default:            break;    }    return temp;}

原文地址：https://www.cnblogs.com/KellyChen/p/9434081.html