65.9K
CodeProject 正在变化。 阅读更多。
Home

使用 jQuery 根据条件设置表格列背景颜色

starIconstarIconemptyStarIconemptyStarIconemptyStarIcon

2.00/5 (1投票)

2013 年 10 月 11 日

CPOL

1分钟阅读

viewsIcon

7842

Normal 0 false false false EN-US X-NONE X-NONE

Normal 0 false false false EN-US X-NONE X-NONE MicrosoftInternetExplorer4 /* 样式定义 */ table.MsoNormalTable {mso-style-name:"Table Normal"; mso-tstyle-rowband-size:0; mso-tstyle-colband-size:0; mso-style-noshow:yes; mso-style-priority:99; mso-style-qformat:yes; mso-style-parent:""; mso-padding-alt:0in 5.4pt 0in 5.4pt; mso-para-margin-top:0in; mso-para-margin-right:0in; mso-para-margin-bottom:10.0pt; mso-para-margin-left:0in; line-height:115%; mso-pagination:widow-orphan; font-size:11.0pt; font-family:"Calibri","sans-serif"; mso-ascii-font-family:Calibri; mso-ascii-theme-font:minor-latin; mso-fareast-font-family:"Times New Roman"; mso-fareast-theme-font:minor-fareast; mso-hansi-font-family:Calibri; mso-hansi-theme-font:minor-latin; mso-bidi-font-family:"Times New Roman"; mso-bidi-theme-font:minor-bidi;}

有些项目需要高亮显示网格视图或表格中匹配筛选条件的行,但也有其他需求,需要根据列单元格文本/标题文本来高亮显示整列。

当用户点击列标题、将鼠标悬停在列上或用户加载数据时指定筛选表达式以高亮显示特定列标题值时,可以处理此功能/需求。

这也可以通过 JavaScript 处理,这需要编写复杂的脚本,但使用 JQuery 可以更轻松地编写脚本。

在此示例中,突出显示了列“PF”。

以下是用于突出显示列的脚本。

 $(document).ready(function() {
            var pfColumn = $("#Grid_CoWorking th:contains('PF')");
            var index = $("#Grid_CoWorking th").index(pfColumn);
            $("#Grid_CoWorking td:nth-child(" + (index + 1) + ")").css("background-color", "red");
        });

© . All rights reserved.