如何将类添加到<tr>标记

How do I add a class to a <tr> tag using javascript

本文关键字:lt gt 标记 tr 添加      更新时间:2023-09-26

我基本上是想把表中的一行变成不同的颜色。我目前正在使用jquery插件Sheetrock从谷歌表单中获取信息。当第9行的值低于10时,我想把它变成红色。

以下是我目前正在做的工作:http://jsfiddle.net/m04ddeu2/435/。

这是我从中获取信息的谷歌表单:https://docs.google.com/spreadsheet/ccc?key=0AlRp2ieP7izLdGFNOERTZW0xLVpROFc3X3FJQ2tSb2c#gid=0

HTML:

<table id="statistics" class="table table-condensed table-striped"></table>

Javascript:

// Define spreadsheet URL.
var mySpreadsheet = 'https://docs.google.com/spreadsheet/ccc?key=0AlRp2ieP7izLdGFNOERTZW0xLVpROFc3X3FJQ2tSb2c#gid=0';
// Load an entire sheet.
$('#statistics').sheetrock({
    url: mySpreadsheet,
    rowHandler: formatRows
});
var formatRows = function (options) {
    var columnNumber = 9;
    var threshhold = 10;
    $('tr', options.target).each(function (i, el) {
        var $tableRow = $(el);
        var amount = $('td:nth-child(' + columnNumber + ')', $tableRow).text();
        if (parseInt(amount) <= threshhold) {
            $tableRow.addClass('warning');
        }
    });
};

CSS:

.warning {
color:red
}

我在代码中看不到任何问题。我写变量的方式有问题吗?

Sheetrock为rowHandler寻找的函数需要采用以下形式:

// Default row handler: Output a row object as an HTML table row.
var toHTML = function (row) {
    var cell;
    var html = '';
    // Use "td" for table body row, "th" for table header rows.
    var tag = (row.num) ? 'td' : 'th';
    // Loop through each cell in the row.
    for (cell in row.cells) {
        if (row.cells.hasOwnProperty(cell)) {
            // Wrap the cell value in the cell tag.
            html += wrapTag(row.cells[cell], tag, '');
            // you can add your logic here to test for ninth column value under 10
        }
    }
    // Wrap the cells in a table row tag.
    return wrapTag(html, 'tr', '');
};