layui table 渲染后改变背景色或颜色

一、table列表渲染

1、jsp

    <div class="main_list" id="main_list">
        <table class="layui-hide" id="table_list" lay-filter="table_list"></table>
    </div>

 

2、js

function query() {

    var querystr = "page_goto=1";
    querystr += "&page_size=8";
    querystr += "&event_id="+event_id;
    querystr += "&update_time="+update_time;
    layui.use('table', function(){
        var table = layui.table;
        //第一个实例
        table.render({
            elem: '#table_list'
            ,url: sys_ctx + '/baseloginfo/default.do?method=getEventLogDetail&'+ querystr
            ,cols: [[ //表头
                {field: 'column_name', title: '字段名称', width:'13%'},
                {field: 'field_before', title: '修改前', width:'25%',templet:function (d) {
                        var tmp = "";
                        if(d.column_name=="上报图片"){
                            tmp="查看图片";
                        } else {
                            tmp=d.field_before;
                        }
                        return tmp;
                    }},
                {field: 'field_after', title: '修改后', width:'25%',templet:function (d) {
                        var tmp = "";
                        if(d.column_name=="上报图片"){
                            tmp="查看图片";
                        } else {
                            tmp=d.field_after;
                        }
                        return tmp;
                    }},
                {field: 'update_name', title: '修改人', width:'15%'},
                {field: 'create_date', title: '修改时间', width:'20%'}
            ]],done:function (res, curr, count) {
                //判断某一列是图片的话，给下划线
                var re = res.data;
                if(re.length>0){
                    $.each(re,function (ii,dd) {
                        if(dd.column_name=="上报图片"){
                            $($(".layui-table-body.layui-table-main tr")[ii]).css("text-decoration", "underline");
                            $($("div .layui-table-fixed.layui-table-fixed-l .layui-table-body tr")[ii]).css("text-decoration", "underline");
                        }

                    })

                }

            }
            ,page:false

        });
        //监听行单击事件（单击事件为：rowDouble）
        table.on('row(table_list)', function(obj){
            var data = obj.data;
            var name = JSON.stringify(data.column_name);
            var column_name = name.replace(/"/g,"");
            var field_before = rep(JSON.stringify(data.field_before));
            var field_after = rep(JSON.stringify(data.field_after));
　　　　　　　//判断如果table行是图片的话，可点击事件
            if(column_name=="上报图片"){
                window.top.layer.open({
                    type : 2,
                    title : "图片查看",
                    shadeClose : true,
                    shade : 0.8,
                    zIndex : window.top.layer.zIndex,
                    area: ['668px', '398px'],
                    content : sys_ctx + '/base/system/baseloginfo/logEventDetail/logEventFJ.jsp?field_before='+field_before+'&field_after='+field_after,
                    end: function(){
                    }
                });
            }
            return false;


            //标注选中样式
            obj.tr.addClass('layui-table-click').siblings().removeClass('layui-table-click');
        });

    });


}

3、列表效果图