Question

我有一些框表示出现日历中的方块。我已经定义了数据属性中每个框的日期，我用它来比较当天。我今天试图添加一个班级＆＃39;到代表当天的方框。我已经创造了一个小提琴来证明这一点。如何修复它以便将今天的类添加到相应的框中？

$(function() {
var currentDate = Date.now();

$(".grid-item").each(function() {
    var specifiedDate = $(this).data('date');
    var date = Date.parse(specifiedDate);

    if (!isNaN(date) == currentDate) {
        $(this).addClass('today');
    }
    else if(!isNaN(date) && currentDate - date > 0) {
        $(this).addClass('past');
    }
    else {
        $(this).addClass('future');
    }
});
});

Answer 1

请参阅this JSFiddle

的JavaScript

$(function() {
    var currentDate = Date.parse((new Date()).toLocaleDateString());

    $(".grid-item").each(function() {
        var specifiedDate = $(this).data('date');
        var date = Date.parse(specifiedDate);

        if (!isNaN(date) && date == currentDate) {
            $(this).addClass('today');
        }
        else if(!isNaN(date) && currentDate - date > 0) {
            $(this).addClass('past');
        }
        else {
            $(this).addClass('future');
        }
    });
});

Answer 2

您可以使用以下jquery将类添加到当前日期，只需将您的jquery替换为以下内容： -

$(function() {
    var d =new Date();
    var curmonth = d.getMonth()+1;
    var curDate = d.getFullYear()+"-"+curmonth+"-"+d.getDate();

    $(".grid-item[data-date="+curDate+"]").addClass("today");
});

Answer 3

您不必使用Date.now()，因为这不会输出类似于data属性的日期。相反，您必须创建当前日期并检查以下条件：

＆＃13;

$(function() {
  var date = new Date(),
    currentDate = date.getFullYear() + "-" + (date.getMonth() + 1) + "-" + date.getDate();
  $(".grid-item").each(function() {
    var specifiedDate = $(this).data('date');
    if (specifiedDate == currentDate) {
      $(this).addClass('today');
    } else if (currentDate > specifiedDate) {
      $(this).addClass('past');
    } else {
      $(this).addClass('future');
    }
  });
});

＆＃13;

.grid-item {
  height: 170px;
  width: 170px;
  float: left;
  background: red;
  margin: 10px;
}
.today {
  background: yellow;
  border: red 1px solid;
}
.past {
  background: black;
  border: red 1px solid;
}
.future {
  background: blue;
  border: red 1px solid;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="grid-item" data-date="2015-11-23">
</div>
<div class="grid-item" data-date="2015-11-24">
</div>
<div class="grid-item" data-date="2015-11-25">
</div>
<div class="grid-item" data-date="2015-11-26">
</div>
<div class="grid-item" data-date="2015-11-27">
</div>
<div class="grid-item" data-date="2015-11-28">
</div>
<div class="grid-item" data-date="2015-11-29">
</div>

＆＃13;

Answer 4

您的代码中存在一个错误。 Date.now()为您提供当前时间戳（以毫秒为单位）。虽然data-date中的日期在任何情况下都不匹配。 正确的方法是比较日期而不是时间戳。 或者只是选择没有时间进行比较的日期

Answer 5

最简单的解决方案是创建new Date()对象，并将其小时，分钟和秒设置为0，如下所示：

currentDate = new Date();
currentDate.setHours(0);
currentDate.setMinutes(0);
currentDate.setSeconds(0);

然后：

var date = new Date(specifiedDate);
date.setHours(0);
date.setMinutes(0);
date.setSeconds(0);

请注意，我还将date的小时，分钟和秒设置为0到期时区（这可以修复，但正如我所说，这似乎是最简单的方法）

Answer 6

或者你可以简单地使用：

$(function() {
    $(".grid-item").each(function() {

        $('.grid-item').eq(new Date().getDay()-1).addClass('today');

    });
 });

<强> FIDDLE

Answer 7

尝试此代码

$(function() {
var currentDate = new Date();

$(".grid-item").each(function() {
    var specifiedDate = $(this).data('date');
    var date = new Date(specifiedDate);

    if(date.setHours(0,0,0,0) == currentDate.setHours(0,0,0,0)){

        $(this).addClass('today');
    }

});
});

Answer 8

可能的解决方案

jsfiddle

$(function() {
    var currentDate = Date.now();
    var a = new Date(currentDate);
    $(".grid-item").each(function() {
        var specifiedDate = $(this).data('date');
        var date = Date.parse(specifiedDate);
        var b = new Date(date);
        if (!isNaN(b) && b.getMonth() == a.getMonth() && b.getDay()== a.getDay() && b.getYear() == a.getYear()) {
            $(this).addClass('today');
        }
        else if(!isNaN(b) && a - b > 0) {
            $(this).addClass('past');
        }
        else {
            $(this).addClass('future');
        }
    });
});

Answer 9

这段代码最后一天对我有用。希望这可以帮助你..

var today = new Date();
var dd = today.getDate();
var mm = today.getMonth()+1; //January is 0!
var yyyy = today.getFullYear();
if(dd<10){
        dd='0'+dd
    } 
if(mm<10){
        mm='0'+mm
    } 
var today = yyyy+'-'+mm+'-'+dd;

if (date == today) {
    $(this).addClass('today');
}

确保两个日期格式相同..

如果日期是今天，则添加课程

9 个答案: