Question

我有一个包含两个div的事件页面，一个页面保存即将发生的事件，另一个页面保存过去的事件。

我想要一个脚本，该脚本会自动检查即将发生的事件div中每个事件的日期，如果有任何事件的日期是过去的日期（今天之前），那么它将自动将该事件移至过去的事件div。

我的标记类似于：

<div class="all-events">

    <div class="upcoming-events">
        <div class="event">
            <p class="event-date"></p>
            .
            .
            .

        </div>
    </div>
    <div class="past-events">
        <div class="event">
            <p class="event-date"></p>
            .
            .
            .

        </div>
    </div>
</div>

我希望脚本

经过研究，我发现这段代码可以使用javascript比较两件事：

<script>
 var date = document.getElementById("inputDate").value;
var varDate = new Date(date); //dd-mm-YYYY
var today = new Date();
today.setHours(0,0,0,0);

if(varDate >= today) {
    alert("Working!");  
}

</script>

但是我不确定这是否对我而言有用。

谢谢

Answer 1

您不应将事件从即将发生的事件移到过去，而应将事件直接创建在过去的div中。

这应该做到：

var postDateInput = $('.event-date').text();
var postDate = new Date(postDateInput);
var todayDate = new Date();
todayDate.setHours(0,0,0,0);

if(postDate < todayDate) {
  // past events
}

Answer 2

我是初学者，但我想尝试：

var eventdates = document.querySelectorAll(".event-date");
var today = new Date();
today.setHours(0,0,0,0);

// Loop of all event dates
for (var i = 0; i < eventdates.length; i++) {
  var varDate = new Date(eventdates[i].textContent); 

  // Compare date
  if(varDate < today) {

    //Get Parent node of each <p class="event-date">...</p>
    var event = eventdates[i].parentNode;

    // Get the node index of <div class="events" when moving to upcoming events
    var event_index = [].indexOf.call(event.parentNode.children, event);

    // Get upcoming events container                                  
    var upcoming_events = document.querySelector(".upcoming-events");

    // Get past events container
    var past_events = document.querySelector(".past-events");

    // move the <div class="events" with node index to upcoming events 
    upcoming_events.appendChild(past_events.childNodes[event_index]);
  }
}

告诉我是否可行。谢谢。

jQuery如果发布日期早于今天，则将其移至另一个div

2 个答案: