Javascript jQuery:使用日期对象隐藏div

我想用JavaScript/jQuery创建一个非常简单的html时间表。 因此，每个事件都有一个div，带有一个day、moth和year数据属性。脚本应该将这些数据属性与当前日期进行比较，并在一天过去时隐藏/显示容器（希望您理解：D）。不幸的是，这不起作用：(

我当前的代码：

---

我认为您的js部分存在一些问题。

该函数中的这个

关键字将引用函数本身。您需要一个循环来遍历DOM节点，然后获取每个节点的数据属性

 $(document).ready(function() {
   dateMethod();
 });

 function dateMethod() {
   var today = new Date();
   var dd = today.getDate();
   var mm = today.getMonth() + 1;
   var yyyy = today.getFullYear(); 
   $('.event').each(function() {
        var day = $(this).data("day");
        var month = $(this).data("month");
        var year = $(this).data("year");
        if (yyyy < year && mm <= month && dd > day){ 
            $(this).show(); 
        } else{ 
            $(this).hide();
        }
    });
 }

$（文档）.ready（函数（）{
dateMethod（）；
});
函数dateMethod（）{
var today=新日期（）；
var dd=today.getDate（）；
var mm=today.getMonth（）+1；
var yyyy=today.getFullYear（）；
$（'.event'）。每个（函数（）{
var day=$（此）.data（“日”）；
var月=$（此）.data（“月”）；
var年=$（本）.data（“年”）；
如果（yyyy<年和月日）{
$（this.show（）；
}否则{
$（this.hide（）；
}
});
}

为了比较两个日期，你不需要逐日逐月比较，也不需要逐年比较

您可以简单地比较这两个日期对象

只记住间隔0到11的月份范围

代码段（）：

$（文档）.ready（函数（）{
dateMethod（）；
});
函数dateMethod（）{
var today=新日期（）；
$（'.event'）。每个（函数（idx、ele）{
var日=$（ele）.数据（“日”）；
变量月=$（ele）.数据（“月”）；
var年=$（ele）.数据（“年”）；
var divDate=新日期（年、月-1、日）；
$（ele）.toggle（divDate>=今天）；
})
}

@导入url（'https://fonts.googleapis.com/css?family=Montserrat:400,500,700');
* {
字体系列：蒙特塞拉特；
保证金：0；
填充：0；
}
.事件h2{
文本转换：大写；
显示：内联；
颜色：#fff；
}
.事件{
最大宽度：40em；
背景色：#009688；
填充：.5em；
利润率：1米0 2米1米；
}

生日
28.07.2017
描述

夏季派对
05.08.2017
描述

会议
20.08.2017
描述

您的if状况应如下所示：

if year is behind or same year but month is behind or same year and month but day is behind then show else hide 如果 时隔一年 年份相同，但月份落后或 同一年，同一个月，但日子已经过去了 然后展示 否则隐藏

if（yyyy

这是您想要实现的目标吗？

            @import url('https://fonts.googleapis.com/css?family=Montserrat:400,500,700');

        * {
            font-family: Montserrat;
            margin: 0;
            padding: 0;
        }

        .event h2 {
            text-transform: uppercase;
            display: inline;
            color: #fff;
        }

        .event {
            max-width: 40em;
            background-color: #009688;
            padding: .5em;
            margin: 1em 0 2em 1em;
        }

 $(document).ready(function() {
   dateMethod();
 });

 function dateMethod() {
   var today = new Date();
   var dd = today.getDate();
   var mm = today.getMonth() + 1;
   var yyyy = today.getFullYear(); 
   $('.event').each(function() {
        var day = $(this).data("day");
        var month = $(this).data("month");
        var year = $(this).data("year");
        if (yyyy < year && mm <= month && dd > day){ 
            $(this).show(); 
        } else{ 
            $(this).hide();
        }
    });
 }

if year is behind or same year but month is behind or same year and month but day is behind then show else hide

if (yyyy < year 
  || (yyyy === year && mm < month) 
  || yyyy ===  year && mm === month && dd < day){