如何使用jquery根据日期条件更改css?

时间:2012-07-09 01:22:31

标签: javascript jquery

在我的网页上,我有一个日期表(我的日期格式是dd-mm-yyyy)

<tr>
    <td>05-03-2012</td>
    <td name="expiration">09-07-2012</td>
    <td>08-10-2012</td>
 <tr>

我想要的是当它们的值为&gt;时加入红色到期日期。当前日期,使用Jquery。

所以,我想我会使用类似的东西:

<script>
//don't know how to retrieve the expiration date and check if it is after the
//current date 

$('td[name=expiration]').css({"color":"red"});
</script>

3 个答案:

答案 0 :(得分:3)

更喜欢使用类而不是名称,以便您的选择器更有效:

<tr>
    <td>05-03-2012</td>
    <td class="expiration-date">09-07-2012</td>
    <td>08-10-2012</td>
</tr>

var now = new Date;
$('.expiration-date').text(function (i, v) {
    if (now < new Date(v)) {
        $(this).addClass('unexpired');
    }
});

以下是jsFiddle中的示例:http://jsfiddle.net/qRdNe/

答案 1 :(得分:2)

这不会解释日期时间解析中的任何错误。

$('td[name=expiration]').each(function(){

    var innerText = $(this).text();
    var date = new Date(innerText);
    var today = new Date();    

    if(date > today){
       //Set css here
    }
    else{
       //Set default here
    }

});

答案 2 :(得分:0)

我基本上已经根据这里给出的不同位汇总了一个有效的答案,但在需要时进行了修正,一个月的日期从零开始。也许你不想接受这个作为正确的答案,我只是把所有这些都放在这里,以便于参考。

$('.expiration').text(function(i,v){
    var datestr = v.split("-");
    d = new Date(datestr[2],datestr[0]-1,datestr[1],0,0,0,0);
    var now = new Date();        
    if(console)console.log(d);        
    if(d>now )
             {
                $(this).css("color","red");            
             }                

});

http://jsfiddle.net/6zb5W/3/