使用jQuery更改背景色CSS

时间:2013-10-23 20:23:14

标签: jquery css jqgrid

嗨,我有一个jQGrid,这样的生成细胞:

       <td role="gridcell" 
       title=" Hull City AFOdds: 1.74Stake: 27Ret: 46.98Ben: 0.98(Back)" 
       aria-describedby="list2_bet_2">...</td>

我想用jQuery给这个td一个自定义样式。我怎么能访问它的CSS ??

由于

3 个答案:

答案 0 :(得分:0)

如果您事先知道aria-describedby属性的值,则可以将td定位为:

jQuery("td[aria-describedby='list2_bet_2']")

然后修改背景颜色

jQuery("td[aria-describedby='list2_bet_2']").css('background-color','#f00');

答案 1 :(得分:0)

设置表格的所有TD元素:

$('td').css('background-color', 'red');

如果您只想设置特定的TD,请使用其他选择器。

答案 2 :(得分:0)

如果要测试每一行和那些单元格内容,可以执行类似下面的操作,迭代每一行,如果该行的两个测试单元格都为0,则单元格为红色:

var rowIds = $(grid).jqGrid('getDataIDs');

for (i = 1; i <= rowIds.length; i++) {
    rowData = $(grid).jqGrid('getRowData', i);

    //check on TradeAmount and FoilTradeAmount Cells
    //color background red if both are 0...the user should have to selecte a postive value of either cell
    if (rowData['TradeAmount'] == 0 && rowData['FoilTradeAmount'] == 0) {
        $(grid).jqGrid('setCell', i, 'TradeAmount', "", { 'background-color': '#F08080', 'background-image': 'none', 'font-weight': 'bold' })
        .jqGrid('setCell', i, 'FoilTradeAmount', "", { 'background-color': '#F08080', 'background-image': 'none', 'font-weight': 'bold' });
    } //if
    else {
        $(grid).jqGrid('setCell', i, 'TradeAmount', "", { 'background-color': '#5ccd06', 'background-image': 'none', 'font-weight': 'bold' })
        .jqGrid('setCell', i, 'FoilTradeAmount', "", { 'background-color': '#5ccd06', 'background-image': 'none', 'font-weight': 'bold' });
    }
} //for

如果您只想在列中设置任何单元格样式,则可以执行类似

的操作
.className td[aria-describedby="GridName_RowName"] {background-color: #F08080;}

然后部分网格初始化测试每一行并在满足某些条件时添加一个类:

        rowattr: function (rd) {//if the row is displaying an inactive user, give it a different CSS style
            if (rd.CellName!= 0) { return { "class": "DeckListMissingAmount" }; } //if

        },