jquery - 如何更改 jqgrid 自定义格式化程序中单元格的背景颜色？

Question

我可以通过在 jqgrid 自定义格式化程序中执行此操作来更改文本颜色:

function YNFormatter(cellvalue, options, rowObject)
{
    var color = (cellvalue == "Y") ? "green" : "red";
    var cellHtml = "<span style='color:" + color + "' originalValue='" +
                                cellvalue + "'>" + cellvalue + "</span>";

    return cellHtml;
 }

但我现在想更改整个单元格的背景颜色(而不是文本颜色)。

这可能吗？

Answer 1

如果你想使用 <span>自定义单元格格式化程序内部的元素，您可以从自定义格式化程序返回

return '<span class="cellWithoutBackground" style="background-color:' +
       color + ';">' + cellvalue + '</span>';

其中span.cellWithoutBackground的样式例如，您可以定义如下

span.cellWithoutBackground
{
    display:block;
    background-image:none;
    margin-right:-2px;
    margin-left:-2px;
    height:14px;
    padding:4px;
}

它是如何工作的，你可以实时看到here :

更新:答案已经过时了。最佳实践是使用 cellattr回调colModel而不是使用自定义格式化程序。更改单元格的背景颜色通常只是分配 style或class属性到列的单元格( <td> 元素)。 cellattr colModel 列中定义的回调完全可以做到这一点。人们仍然可以使用预定义的格式化程序，例如 formatter: "checkbox" , formatter: "currency" , formatter: "date"等等，但仍然更改列中的背景颜色。以同样的方式rowattr回调，可以定义为 jqGrid 选项(在 colModel 的特定列之外)，允许分配整行( <tr> 元素)的样式/类。

有关cellattr的更多信息可以查到here和 here ， 例如。 Another answer解释rowattr .