2016-10-04 3 views
0

複数のテーブル行があります。クラス "dates"を持つ表のセルには、日付または値 "Permanent"を含めることができます。日付があり、今日の日付よりも大きい場合は、赤で塗りつぶす必要があります。​​がある場合は日付を取得

私が試した(ただし、動作しません):

if(($(".dates").getDate() < new Date()) != -1) { 
     $(".dates").style.color = "green"; 
} 

はHTML:

<table> 
    <tr> 
    <td>Permanent</td> 
    </tr> 
    <tr> 
    <td>Permanent</td> 
    </tr> 
    <tr> 
    <td>2.05.2015</td> 
    </tr> 
</table> 
+0

値 –

+0

$( "日付")を使用してサンプルHTMLを表示します。のgetDate()私はこの正しい –

+0

はあなたのコードの多くを示してください?とは思いませんか日付はどのような形式ですか? –

答えて

0

$(".dates").each(function(){ 
 
    
 
    if(new Date($(this).html()) < new Date()) { 
 
     $(this).css("color", "green"); 
 
    } 
 
    
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table> 
 
\t \t <tr> 
 
\t \t \t <td>abc</td> 
 
\t \t \t <td class="dates">2016-10-10</td> 
 
\t \t \t <td>abc</td> 
 
\t \t </tr> 
 
\t \t <tr> 
 
\t \t \t <td>abc</td> 
 
\t \t \t <td class="dates">2016-09-10</td> 
 
\t \t \t <td>abc</td> 
 
\t \t </tr> 
 
\t \t <tr> 
 
\t \t \t <td>abc</td> 
 
\t \t \t <td class="dates">2016-08-10</td> 
 
\t \t \t <td>abc</td> 
 
\t \t </tr> 
 
\t \t <tr> 
 
\t \t \t <td>abc</td> 
 
\t \t \t <td class="dates">2016-11-10</td> 
 
\t \t \t <td>abc</td> 
 
\t \t </tr> 
 
</table>

0

あなたは、あなたが扱っているようにする必要があります適切な形式の日付を使用するか、Moment.jsのようなライブラリを使用してください。適切な日付を扱っている場合は、new Date()を使用して、セルの日付と今日の日付を比較し、条件付きでCSSを適用することができます。

$(document).ready(function(){ 
 
    $('.date').each(function(){ 
 
    if (new Date($(this).text()) > new Date()) { 
 
     $(this).css('background-color', 'red'); 
 
    } 
 
    }); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table> 
 
    <tr><td class="date">Tue Oct 04 2016 01:24:37 GMT-0600 (MDT)</td></tr> 
 
    <tr><td class="date">Mon Oct 03 2016 01:24:37 GMT-0600 (MDT)</td></tr> 
 
    <tr><td class="date">Fri Oct 07 2016 01:24:37 GMT-0600 (MDT)</td></tr> 
 
    <tr><td class="date">Mon Oct 03 2016 01:24:37 GMT-0600 (MDT)</td></tr> 
 
    <tr><td class="date">Permanent</td></tr> 
 
    <tr><td class="date">Sat Oct 05 2016 01:24:37 GMT-0600 (MDT)</td></tr> 
 
    <tr><td class="date">Sun Oct 07 2016 01:24:37 GMT-0600 (MDT)</td></tr> 
 
    <tr><td class="date">Mon Oct 08 2016 01:24:37 GMT-0600 (MDT)</td></tr> 
 
    <tr><td class="date">Tue Oct 09 2016 01:24:37 GMT-0600 (MDT)</td></tr> 
 
    <tr><td class="date">Permanent</td></tr> 
 
    <tr><td class="date">Wed Oct 10 2016 01:24:37 GMT-0600 (MDT)</td></tr> 
 
</table>

関連する問題