Question

我在表中有很多行，如下所示：

<tr>
    <td class="lang_body_2">Upper Management</td>
    <td class="lang_body_2">3.00%</td>
    <td class="lang_body_2">3.40%</td>
    <td class="lang_body_2 index_num">88</td>
</tr>

我想做的是根据该单元格的值设置最后一个单元格（带有“88”的单元格）。也就是说，如果数字（在这种情况下为88）大于50，则将值的颜色（再次为88）更改为某种颜色。

我尝试了这个，但它不起作用：

$(document).ready(function () {
    if ($(".index_num").val() == 88) {
        $( this ).css( "color", "red" )
    }
});

我最终会有一堆逻辑语句来定义颜色，但我想在尝试其他一些事情之前先让它工作。例如，如果单元格中的值大于100，那么XYZ，如果它大于50＆amp;＆amp;小于100，然后是ZYX（依此类推）。现在，我很高兴只有一个细胞是正确的。

此外，如果我有多个具有相同类别（.index_num）的单元格，它们每个都能够定义颜色，还是只会根据脚本首先找到的单元格更改为一种颜色？显然，我需要第一件事。

任何帮助将不胜感激。

Answer 1

jQuery的val()方法用于input，textarea和select等表单元素。您想要使用的是text()，您可能希望将其转换为数字（我在下面使用Unary Plus（+）运算符完成此操作） - 这样您就可以使用>和<来检查值是否介于某个范围之间，但如果您仅仅针对一个值进行比较，则不需要这样做：

if (+$(".index_num").text() == 88)

此外，this与简单.index_num语句中的if元素无关。假设您只有一个.index_num元素，则可以使用：

if (+$(".index_num").text() == 88) {
    $(".index_num").css( "color", "red" )
}

$(".index_num").each(function() {
    if (+$(this).text() == 88) {
        $(this).css( "color", "red" )
    }
});

Answer 2

试试这个

$(document).ready(function () {
    $(".index_num").each(function(){
        if (  $( this ).text() == "88" )
            $( this ).css( "color", "red" )
    })
});

注意＆＃34; 88＆＃34;引号或使用

if ( parseInt( $(this).val(),10 ) == 88 )

http://jsfiddle.net/alemarch/cr1v8mLa/

Answer 3

jquery .each（）将帮助您遍历具有特定类的所有元素。我试过这样的事情。

$(document).ready(function () {
    $(".index_num").each(function() {
        var score = $(this).text();
        if (score < 50)
        {
            $(this).css("color", "red");    
        }
        else if (score >= 50 && score < 100)
        {
            $(this).css("color", "orange");    
        }
        else
        {
            $(this).css("color", "green");    
        }
    });
});

请参阅JS Fiddle

div中的样式编号基于数字的值

3 个答案: