KendoGrid 使用选中的复选框而不突出显示行答案

【问题标题】：KendoGrid using selected checkbox without highlighting rowKendoGrid 使用选中的复选框而不突出显示行
【发布时间】：2018-04-17 11:44:33
【问题描述】：

我正在使用带有 AngularJS 的 KendoUi Grid（最新版本）

我想在显示复选框的列上使用可选择功能来（多）选择行。这工作正常。 But when the row is selected its colour changes.但我只想使用复选框而不突出显示整行。

我试图弄清楚我必须使用哪个 css。这也适用于设置“.k-grid table tr.k-state-selected”css。但是当鼠标悬停在选定的行上时，它仍然是彩色的。我也尝试设置这些“.k-grid td.k-state-selected:hover, .k-grid tr:hover”css，但它不起作用。

我必须设置哪个 css，以禁用完成选定行的突出显示。这是我当前使用的 css。悬停的部分不起作用。

.k-grid table tr.k-state-selected {
    color: red !important;
    background-color: none !important;
    background: none !important;
    border-color: none !important;
}

.k-grid td.k-state-selected:hover, .k-grid tr:hover {
    color: green !important;
    background-color: none !important;
    background: none !important;
    border-color: none !important;
}

红色和绿色只是为了测试，看看它是否工作......

那么，我必须（重新）设置哪个 CSS 来禁用突出显示？

谢谢

【问题讨论】：

目标是移除网格上的选择功能还是只是改变样式？
我需要带有复选框的选定功能。我只是希望该行在被选中时不要更改样式。
请试试我的回答。如果您需要，您可以将Class 添加到您的函数中

标签： angularjs kendo-ui kendo-grid

【解决方案1】：

您可以向网格的更改事件添加一个函数。只需将其添加到您的网格定义中即可。

change: functionName

在你的函数调用中：

$('.k-state-selected').removeClass('k-state-selected k-state-selecting');

【讨论】：

【解决方案2】：

我用 removeClass 试过了。现在高光已经消失了。如我所愿。但是现在内部选择了哪一行的信息也没有了。

change: function(_) {
    var selectedRows = this.select(); 
    console.log(selectedRows.length);
}

-> 1

change: function(_) {
    $('.k-state-selected').removeClass('k-state-selected k-state-selecting'); 
    var selectedRows = this.select(); 
    console.log(selectedRows.length);
}

-> 0

所以看来这门课是必要的。唯一的办法就是覆盖css信息。

【讨论】：