突出顯示錶格行中的最新日期

我有下表，我試圖找到一種方法來添加一個'高亮'類到單元格（class =「dateRow」）與最近的日期/時間。在這種情況下，它將是第四個，其日期是'2013-05-30'。突出顯示錶格行中的最新日期

我已經嘗試了各種選擇，但似乎不能使它工作。有人可能會告訴我，因爲我一直在試圖弄清楚這一點，而且似乎無法使其發揮作用。

<table> 
    <tr class="topRow"> 
     <td>Yes</td>  
     <td class="dateRow">2013-05-23 13:53:20</td>  
     <td class="dateRow">2013-05-21 13:53:21</td>  
     <td class="dateRow">2013-05-29 13:53:22</td>  
     <td class="dateRow">2013-05-30 13:53:23</td>  
     <td class="dateRow">2013-05-29 13:53:24</td>  
     <td class="dateRow">2013-05-28 13:53:19</td>  
     <td>Some Text</td> 
     <td class="dateRow">2013-05-27 13:53:18</td> 
    </tr> 
</table>

我試着去適應最新的JS如下：

<script> 
$(window).load(function() 
    { 
     $('.thisRow').each(function() { 
      var $tds = $(this).children('td'), 
       max = null, 
       maxIndex = null; 

     $tds.each(function() { 
      var value = +$(this).text().substr(1); 
      if(isNaN(value)) { 
      if(!max || value > max) { 
       max = value; 
       maxIndex = $(this).index(); 
      } 
     } 
     }); 
    if(maxIndex !== null) { 
     $tds.eq(maxIndex).addClass('highlight'); 
    } 
}); 
    } 
); 
</script>

我想，這是一個必須適應NaN的，因爲這並至少選中一個單元格，雖然最後一。

來源

2013-05-30 IGGt

'我曾嘗試過各種options'哪些選項是那些？向我們展示一些代碼！ –

對不起，我曾嘗試過各種各樣的事情，其中大部分都失敗了。我已經添加了最近的一個，這部分工作（它至少突出了cel）。我認爲這是NaN需要改變的東西，但看不到什麼？ – IGGt

你沒有標記這個問題爲jQuery的，但你展示一些jQuery代碼，所以我假設jQuery是可以接受的。

在循環遍歷所有日期時跟蹤最大值。訣竅是你的日期格式轉化成可接受的JavaScript日期格式：

$(function() { 
    //keep track of max values 
    var maxCell = undefined; 
    var maxVal = undefined; 

    $('.dateRow').each(function() { 
     var that = $(this); 
     var dt = new Date(that.text().replace(' ', 'T')); //convert to js date 
     if (!maxCell || dt > maxVal) { 
      //update max values 
      maxCell = that; 
      maxVal = dt; 
     } 
    }); 
    maxCell.addClass('highlight'); //highlight cell with max value 
});

Working example.

來源

2013-05-30 15:19:27 cfs

謝謝，我試過了，但它現在突出了第一個單元格「2013-05-23 13:53:20」，而不是最近？ – IGGt

@IGGt啊......對不起，當我應該使用'.text（）'時，我使用'.val（）'...更新了我的答案並提供了工作小提琴 – cfs

，這是非常棒的歡呼聲，並且完美地工作。 – IGGt

問題不在於您的代碼，而是日期格式。請將其更改爲：

<tr class="topRow"> 
    <td>Yes</td>  
    <td class="dateRow">2013/05/23 13:53:20</td>  
    <td class="dateRow">2013/05/21 13:53:21</td>  
    <td class="dateRow">2013/05/29 13:53:22</td>  
    ...

上述格式幾乎適用於所有瀏覽器。欲瞭解更多信息，請參考以下鏈接：

來源

2013-05-30 15:14:12

這很有趣，因爲我直接從MySQL中取出日期，所以不認爲日期格式可能不正確。非常有用的知道。 – IGGt

是的。這適用於所有瀏覽器。 :) –

突出顯示錶格行中的最新日期

回答

相關問題