如果数字大于“x”，则更改CSS

Question

不确定这是否可能，或者我可能会以错误的方式进行处理。我iFraming来自我的雇主的实时数据流，并且需要能够更改特定div的颜色，如果其中包含的数字大于5:00。

所以对于数据流的代码看起来像这样

<tr class="rowColour" style="background: #FFCFCF"> 
    <td style="text-align: left;width: 25%">Firstname.Lastname</td> 
    <td style="width: 40%;">On Call (4:17 mins)</td> 
    <td style="width: 35%">Company 1</td> 
</tr> 

<tr class="rowColour" style="background: #FFCFCF"> 
    <td style="text-align: left;width: 25%">Firstname.Lastname</td> 
    <td style="width: 40%;">On Call (0:49 mins)</td> 
    <td style="width: 35%">Company 1</td> 
</tr> 

所以基本上我需要看看什么是包含在括号中（例如在呼叫（0:49分钟））。所以如果变成5点或更长时间，我需要颜色变成红色。

但我真的不知道如何做到这一点。使用jQuery包含选择器我可以为每个人说“On Call”，但我需要它只查看大于5:00分钟的数据。

这里是我的jQuery目前有：

$(document).ready(function(){ 
$(".rowColour:contains(On Call)").css("color","red"); 
}); 

这是可行的？如果是这样，我该如何去做呢？任何帮助将非常感激。

Answer 1

您必须提取数字，并且可以将5:00转换为数字500，您可以检查它是否高于或低于过滤条件等。

$(document).ready(function(){ 
    $(".rowColour").filter(function() { 
     var td = $('td:contains(On Call)', this); 
     if (td.length === 0) return false; 

     var time = td.text().replace(/\D/g, ''); 

     return time >= 500; 

    }).css("color","red"); 
}); 

FIDDLE