如果數字大於「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