javascript - 如果数字大于 "x"，则更改 CSS

Question

不确定这是否可行，否则我可能会以错误的方式进行。我正在 iFraming 来 self 雇主的实时数据流，如果其中包含的数字大于比如说 5:00，我需要能够更改特定 div 的颜色。

所以数据流的代码是这样的

<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:00 分钟或更长时间，我需要将颜色设为红色。

但我真的不知道如何做到这一点。使用 jQuery 包含选择器，我能够为所有说“随叫随到”的人做到这一点，但我需要它只查看大于 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