Question

我正在使用带有jquery-ui'smoothness'主题的jqgrid，不幸的是，在这个主题中所选择的行背景颜色太亮了，我正在尝试更改背景颜色以使其更加明显。我已经尝试在css中更改ui-state-highlight（使用！important override），但这不起作用。有没有一种CSS方法可以做到这一点，或者可能是一种jqgrid自定义格式化程序？

Answer 1

班级ui-state-highlight使用background CSS属性。因此，一个小技巧是使用background而不是background-color来删除背景图片。例如

.ui-state-highlight { background: yellow !important; }

查看直播here。

更新：没有必要使用!important。只需指定更具体的规则就足够了

.ui-jqgrid-btable .ui-state-highlight { background: yellow; }

或

.ui-jqgrid .ui-state-highlight { background: yellow; }

Answer 2

jQuery('#jqGrid').find('.ui-state-highlight').css('background', 'skyblue');

您可以在jquery文件中添加如下内容

Answer 3

假设我们想要一个颜色用于所选行单元格和剩余行单元格具有不同颜色，

在下面的示例中，突出显示的行单元格数据将显示为黄色，剩余的行单元格数据将为蓝色

假设我们有两个名为＆＃34; holdRow＆＃34;的类。蓝色背景和＆＃34; HighlightHoldRow＆＃34;对于黄色背景然后使用下面的代码＆＃34; RowSelect＆＃34;是在行选择期间调用的方法

考虑以下代码

   .holdRow td {
font-weight : bold !important;
color: Blue !important;
  }

   .higLightholdRow td {
font-weight : bold !important;
color: Yellow !important;

}

   var LastRowId = "";
    function RowSelect(id) {
if (Flag == "TRUE") {
    var grid = $('#gvName);
    if (LastRowId != "" && LastRowId != undefined && LastRowId != id) {
        tr = grid[0].rows.namedItem(LastRowId);
        $(tr).removeClass("higLightholdRow");
        $(tr).addClass("holdRow");
        LastRowId = "";
    }
    tr = grid[0].rows.namedItem(id);
    $(tr).removeClass("holdRow");
    $(tr).addClass("higLightholdRow");
    LastRowId = id;
    }

}

在Trirand Grid声明期间，我们可以使用以下loc来调用此客户端事件。

   ClientSideEvents-RowSelect="RowSelect"

在选择行期间调用RowSelect方法，所选行将以黄色作为背景，其余行将以蓝色作为背景

选定的行背景颜色

3 个答案: