Javascript 如果日期是今天,则添加类
我有一些盒子,代表降临节日历中的正方形。我已经为数据属性中的每个框定义了日期,我将使用它与当前日期进行比较。我试图在代表当前日期的框中添加一个类“today”。我制作了一把小提琴来演示这一点。如何修复它,以便将今天的课程添加到相应的框中Javascript 如果日期是今天,则添加类,javascript,jquery,Javascript,Jquery,我有一些盒子,代表降临节日历中的正方形。我已经为数据属性中的每个框定义了日期,我将使用它与当前日期进行比较。我试图在代表当前日期的框中添加一个类“today”。我制作了一把小提琴来演示这一点。如何修复它,以便将今天的课程添加到相应的框中 您的代码中只有一个错误Date.now()以毫秒为单位提供当前时间戳。而数据日期中的日期在任何情况下都不匹配正确的方法是比较日期而不是时间戳或者只选择日期而不选择时间进行比较代码中只有一个错误Date.now()以毫秒为单位提供当前时间戳。而数据日期中的日期在
您的代码中只有一个错误
Date.now()
以毫秒为单位提供当前时间戳。而数据日期中的日期在任何情况下都不匹配正确的方法是比较日期而不是时间戳或者只选择日期而不选择时间进行比较代码中只有一个错误Date.now()
以毫秒为单位提供当前时间戳。而数据日期中的日期在任何情况下都不匹配正确的方法是比较日期而不是时间戳或者只选择日期而不选择时间进行比较请参见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');
}
});
});
参见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');
}
});
});
最简单的解决方案是创建newdate()
对象,并将其小时、分钟和秒设置为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);
请注意,我还将日期的小时、分钟和秒设置为0到期时区(这可以是固定的,但正如我所说,这似乎是最简单的方法)最简单的解决方案是创建新日期()
对象,并将其小时、分钟和秒设置为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);
请注意,我还将日期的小时、分钟和秒设置为0到期时区(这可以是固定的,但正如我所说,这似乎是最简单的方法)您可以使用以下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");
});
您可以使用以下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");
});
您不必使用Date.now()
,因为这不会输出与数据属性类似的日期。相反,您必须将当前日期创建为该日期,并签入以下条件:
$(函数(){
变量日期=新日期(),
currentDate=date.getFullYear()+“-”+(date.getMonth()+1)+“-”+date.getDate();
$(“.grid item”)。每个(函数(){
变量specifiedDate=$(this).data('date');
如果(specifiedDate==currentDate){
$(this.addClass('today');
}else if(当前日期>指定日期){
$(this.addClass('pass');
}否则{
$(this.addClass('future');
}
});
});代码>
.grid项{
高度:170px;
宽度:170px;
浮动:左;
背景:红色;
利润率:10px;
}
.今天{
背景:黄色;
边框:红色1px实心;
}
.过去{
背景:黑色;
边框:红色1px实心;
}
.未来{
背景:蓝色;
边框:红色1px实心;
}
您不必使用Date.now()
,因为这不会输出类似于数据属性的日期。相反,您必须将当前日期创建为该日期,并签入以下条件:
$(函数(){
变量日期=新日期(),
currentDate=date.getFullYear()+“-”+(date.getMonth()+1)+“-”+date.getDate();
$(“.grid item”)。每个(函数(){
变量specifiedDate=$(this).data('date');
如果(specifiedDate==currentDate){
$(this.addClass('today');
}else if(当前日期>指定日期){
$(this.addClass('pass');
}否则{
$(this.addClass('future');
}
});
});代码>
.grid项{
高度:170px;
宽度:170px;
浮动:左;
背景:红色;
利润率:10px;
}
.今天{
背景:黄色;
边框:红色1px实心;
}
.过去{
背景:黑色;
边框:红色1px实心;
}
.未来{
背景:蓝色;
边框:红色1px实心;
}
或者您可以简单地使用:
$(function() {
$(".grid-item").each(function() {
$('.grid-item').eq(new Date().getDay()-1).addClass('today');
});
});
或者您可以简单地使用:
$(function() {
$(".grid-item").each(function() {
$('.grid-item').eq(new Date().getDay()-1).addClass('today');
});
});
试试这段代码
$(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');
}
});
});
试试这个代码
$(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');
}
});
});
可能的解决办法
可能的解决办法
这段代码在最后一天对我有效。希望这对你有帮助
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');
}
var today=新日期();
var dd=today.getDate();
var mm=today.getMonth()+1//一月是零!
var yyyy=today.getFullYear();
如果(dd这段代码在最后一天对我有效。希望这对你有帮助
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');
}
var today=新日期();
var dd=today.getDate();
var mm=today.getMonth()+1;//一月是0!
var yyyy=today.getFullYear();
如果(dd),则问题是该日期。现在()返回时间戳。您的日期没有时间部分。将其四舍五入到整天,它将起作用。请看“很好,谢谢”,这非常有用。问题是该日期。现在()返回一个时间戳。你的日期没有时间部分。将它四舍五入到整天,它就会工作。看一看很棒,谢谢这真的很有用这在Chrome中工作,但在我的机器上不是FF或IE?这在Chrome中工作,但在我的机器上不是FF或IE?嗨。它不再工作了。知道为什么吗?你可以参考最新的fiddle Hi。它不是lon你知道为什么吗?你可以参考最新的小提琴