欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

JQuery DataTables根据行数据不同而行或列的更改颜色

程序员文章站 2022-07-12 21:10:40
...
var table;

table = $('#example').DataTable({
            dom: 'Bfrtip',
            scrollY: true,
            scrollX: true,
            scrollCollapse: true,
            colReorder: true,
            select: true,
            stateSave: true,
            //info: false,//关闭左下角关于行数和选中的提示
            //filter: false,//关闭搜索
            //paging: false,//关闭分页
            pagingType: "full_numbers",
            columns: [
                { title: "Name", data: "Name", className: "center" },
                { title: "Position", data: "Position" },
                { title: "Office", data: "Office" },
                { title: "Age", data: "Age" },
                { title: "Salary", data: "Salary", className: "canEditor" },
                { title: "操作", data: null, defaultContent: "<button type='button'>编辑</button>" }
            ],
            rowCallback: RowCallBack,
            language: {
                url: dtsLanguage
            }
        });


function RowCallBack(row, data, index) {
     if (data.Name.indexOf('Tiger') >= 0) { $(row).css('background-color', '#FFB6C1'); }//行变色
     $('td', row).eq(5).css('font-weight', "bold").css("color", "red");//列变色
}

 

相关标签: 前端插件