table单元格背景色

提问 已结
7 312
独秀
独秀 2018-9-21
悬赏:20飞吻
版本:layui 浏览器:
数据表格,怎么根据后台来的数据 判断某个值 改变某个单元格背景色,
回帖
  • 1 回复
  • @独秀
    done: function (res, curr, count) {
    if (res.count == 0) {
    return false;
    }

    var str = "div[lay-filter='LAY-table-1']";
    for (var i = 0; i < res.data.length; i++) {
    //图例颜色单元格颜色设置
    var objTLYS = $(str).children(".layui-table-box").children(".layui-table-body ").find('table tbody').find("tr[data-index='" + res.data[i].LAY_TABLE_INDEX + "']").children('td:eq(3)');
    var cellColorTLYS = objTLYS.attr("data-content");
    objTLYS.css("background-color", cellColorTLYS);
    //降级颜色单元格颜色设置
    var objJJYS = $(str).children(".layui-table-box").children(".layui-table-body ").find('table tbody').find("tr[data-index='" + res.data[i].LAY_TABLE_INDEX + "']").children('td:eq(6)');
    var cellColorJJYS = objJJYS.attr("data-content");
    objJJYS.css("background-color", cellColorJJYS);
    }
    1 回复
  • 示例+实例代码地址, https://www.layui.com/demo/table/style.html
    代码主要部分
    <script type="text/html" id="sexTpl">
    {{# if(d.sex === '女'){ }}
    <span style="color: #F581B1;">{{ d.sex }}</span>
    {{# } else { }}
    {{ d.sex }}
    {{# } }}
    </script>
    0 回复
  • done : function(res, curr, count) {
    var str = "div[lay-filter='LAY-table-" + swyjTableIns.config.index + "']";
    for (var i = 0; i < res.data.length; i++) {
    var obj = $(str).children(".layui-table-box").children(".layui-table-body ")
    .find('table tbody').find("tr[data-index='" + res.data[i].LAY_TABLE_INDEX + "']").children('td:eq(5)');
    $(obj).each(function(index, item) {
    var yjdj = $(item).find(".yjdj").text();
    if (yjdj == "一级预警") {
    $(this).css("background-color", "#FFFF78");
    } else if (yjdj == "二级预警") {
    $(this).css("background-color", "#FF9900");
    } else if (yjdj == "三级预警") {
    $(this).css("background-color", "#EE0000");
    }
    });
    }
    }
    在done里面重新循环
    0 回复
  • 独秀
    2018-9-26
    @CHC云 这个倒是可以文字变色 我想要那种文字所在td的背景变色
    0 回复
  • 请问有解决吗?
    0 回复
  • 独秀
    2018-12-4
    @哈库拉玛塔塔塔 我也解决了 用的 done
    0 回复