格式化单元格文本颜色

Question

此列格式化程序可以很好地设置背景颜色，但我根本看不到文本。

function truthFormatter(cell, formatterParams, onRendered) {
    var cellValue = cell.getValue();
    var cellElement = cell.getElement();
    if (cellValue == "T") {
    cellElement.style.backgroundColor = "#0000B3";
    cellElement.style.color = "#FFFFFF";
    }
    else if (cellValue == "F") {
    cellElement.style.backgroundColor = "#B30000";
    cellElement.style.color = "#FFFFFF";
    }
}

Chrome 对其中一个单元格的样式检查器建议一切正常：

element.style {
    width: 40px;
    text-align: center;
    background-color: rgb(0, 0, 179);
    color: rgb(255, 255, 255);
    height: 25px;
}

我在独立的测试配置中得到了相同的行为---没有应用其他 CSS。

此外，格式化程序不应应用的单元格中的文本不可见---尽管此处的样式检查似乎也很好：

element.style {
    width: 151px;
    text-align: right;
    color: rgb(0, 0, 0);
    height: 32px;
}

Link to screenshot of table as rendered

Link to rendering without the formatter

Answer 1

你的线路：

cellElement.style.color = "#FFFFFF";

应该可以正常工作，我已经运行进行了一些测试，并且可以正常工作。

我建议使用您的浏览器检查器来查看 CSS 覆盖它的内容。

您也没有在格式化程序中返回单元格的值，因此单元格内不会显示任何内容。

您需要将此行添加到格式化程序函数的底部

return cell.getValue();

格式化单元格文本颜色

Format cell text color

javascript

tabulator