jquery - 基于下面行的 JQuery 动态单元格颜色

Question

我有一个从 MySQL 表动态生成的表，我希望单元格根据下面的目标更改颜色。假设 的月份Apr，目标是602，结果是435下面602会是绿色的。但让我们举个Aug例子。结果略高于黄色的目标。但Jun它比目标高出太多，所以我想把它变成红色。

Month   |   Apr     May     Jun     Jul     Aug
---------------------------------------------------
Result  |   435     495     943     735     617
Target  |   602     592     585     584     610

我在 JSfiddle http://jsfiddle.net/D5TQy/中有一个示例，但我不知道如何从下面的行中读取它。

Answer 1

You might need to modify the way i get the variable cellAbove, but take a look at this: (http://jsfiddle.net/D5TQy/3/)

var cell = $('tr').last().find('td');
var cellAbove = $('tr').first().find('td');
var threshold= 100;    //defines what is `too much` difference

cell.each(function() {
    var column = $(this).index();

    var cell_value = $(this).text();
    var valueAbove = cellAbove.eq(column).text();

    //red
    if (cell_value - valueAbove > threshold) {
        $(this).addClass('veryOutsideFromTarget');
    }

    //yellow
    else if ((cell_value - valueAbove > 0)) {
        $(this).addClass('outsideTarget');
    } 

    //green
    else{
        $(this).addClass('insideTarget');
    }
});

Notes: Make use of classes instead of modifying the background inline style. This way is even more simple to read and understand the code.

I modified the logic of your conditions and this way makes more sense.