通过Class改变单元格样式(cell)

效果

HTML （加上样式）

        .bg-color-yellow{
            background-color: yellow;
            color:black;
        }

        .bg-color-green{
            background-color: LightGreen;
            color:black;
        }

JS (栏目定义)

columns: [
  { field: "cur_no", title: "Currency", editor: editors.ws.cur_no, width: 70 },
  { field: "rate", title: "Rate", width: 60, attributes: { style: "text-align: right;" }, editor: editors.readonly },
  { field: "hkd_cost", title: "折算成港幣", width: 85, attributes: { style: "text-align: right;" }, editor: editors.readonly, format: "{0:n}" },
  { field: "adj_fee_rate", title: "加收運費%", width: 85, attributes: { style: "text-align: right;" }, editor: editors.com.price },
  {
     field: "new_cost", title: "New Cost", width: 75,
     attributes: {
       class: "#=(data.new_cost>data.old_cost) ? 'bg-color-yellow' : ((data.new_cost<data.old_cost) ? 'bg-color-green' : '')#", //控制顏色(黃升，綠跌)
       "data-highlight": "1",
       style: "text-align: right;"
       },
     format: "{0:n}", editor: editors.com.price
   },
],

补充

【字段值发生变化时】
            //顏控制
            if (e.field == 'old_cost' || e.field == 'new_cost') {
                if (editorPage !== undefined && editorPage.setRowCellColor && $.isFunction(editorPage.setRowCellColor)) {
                    editorPage.setRowCellColor(row.uid, row.old_cost, row.new_cost);
                }
            }

【找回对应行特定单元格进行设置】
    //設置某行Cell顏色
    setRowCellColor: function (uid, oldValue, newValue) {
        var grid = $("#grid").data("kendoGrid");
        var grdRow = grid.tbody.find("tr[data-uid='" + uid + "']");

        grdRow.find("td[data-highlight='1']").each(function () {
            var $cell = $(this);

            if (oldValue > newValue) {
                $cell.removeClass("bg-color-yellow").addClass("bg-color-green");
            }
            else if (oldValue < newValue) {
                $cell.removeClass("bg-color-green").addClass("bg-color-yellow");
            }
            else {
                $cell.removeClass("bg-color-yellow").removeClass("bg-color-green");
            }
        });
    },