具有当前日期的元素的日期,并分配唯一ID

Date of element with current date and assign unique ID

本文关键字:分配 唯一 ID 日期 当前日期 元素      更新时间:2023-09-26

我有一系列具有唯一日期的div,其中包括与div内容相关的周开始和周结束。如下所示:

<div class="dinnersWeeks">
  <div class="startingDate">8/25/2013 12:00 AM</div>
  <div class="endingDate">8/31/2013 12:00 AM</div>
  <div class="weekLinkMenus"><a href="testweek.aspx">testweek.aspx</a></div>
</div>
<div class="dinnersWeeks">
  <div class="startingDate">9/1/2013 12:00 AM</div>
  <div class="endingDate">9/7/2013 12:00 AM</div>
  <div class="weekLinkMenus"><a href="generalweek11.aspx">generalweek11.aspx</a></div>
</div>
<div class="dinnersWeeks">
  <div class="startingDate">9/8/2013 12:00 AM</div>
  <div class="endingDate">9/14/2013 12:00 AM</div>
  <div class="weekLinkMenus"><a href="generalweek12.aspx">generalweek12.aspx</a></div>
</div>

我一直在努力确定当前日期是否介于每周潜水的开始日期和结束日期之间。

$('div.dinnersWeeks').each( function() {
    sd = new Date( $(this).find( 'div.startingDate' ).text() );
    ed = new Date( $(this).find( 'div.endingDate' ).text() );
    currentDate = new Date();
    console.log(check > sd && currentDate < ed);
});

之后,我将为本周的div和下周的div分配一个ID。

如有任何指导,我们将不胜感激。

以下内容应该有效。我认为checked是您原始代码中的一个拼写错误。我还添加了一个更改背景颜色的示例。这可以很容易地更改为根据您的喜好设置id

JavaScript

$('div.dinnersWeeks').each( function() {
    sd = new Date( $(this).find( 'div.startingDate' ).text() );
    ed = new Date( $(this).find( 'div.endingDate' ).text() );
    currentDate = new Date();
    if(currentDate > sd && currentDate < ed) {
        $(this).css('background-color', 'red'); 
    }
});

JSFiddle:http://jsfiddle.net/markwylde/4wuwZ/

顺便说一句,如果你想在这个项目中做很多与日期相关的任务,我会研究moment.js框架,或者类似的框架。这里有一篇很好的stackoverflow文章,解释了使用它可以完成上述任务的整洁方法:

我假设您使用服务器端语言输出HTML?如果是这样的话,我只需要在div中添加一个带有Unix时间的属性,并在此基础上运行比较器。我相信jQuery中有一个库可以进行日期比较,但如果你不想做任何复杂的事情,你可以使用Unix。

<div class="dinnersWeeks">
  <div class="startingDate" z-start-unix="3000392">8/25/2013 12:00 AM</div>
  <div class="endingDate" z-end-unix="3001394">8/31/2013 12:00 AM</div>
  <div class="weekLinkMenus"><a href="testweek.aspx">testweek.aspx</a></div>
</div>

然后:

$('div.dinnersWeeks').each( function() {
currentDate = Math.round(new Date().getTime() / 1000);
console.log(check > $(this).find('div.startingDate').attr('z-start-unix') && currentDate < $(this).find('div.endingDate').attr('z-end-unix'));
});