根据日期显示/隐藏 div答案

【问题标题】：Show/Hide divs based on date根据日期显示/隐藏 div
【发布时间】：2012-10-29 12:15:37
【问题描述】：

我正在尝试根据日期显示隐藏 div，并尝试使用以下代码：

<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script>

window.setInterval(function(){

  var current = new Date();
  var expiry  = new Date("October 29, 2012 12:00:00")
  var expiry2 = new Date("October 30, 2012 12:00:00")

  if(current.getTime()>expiry.getTime()){
    $('#one').hide();
    $('#two').show();
  }

  else(current.getTime()>expiry2.getTime()){
       $('#two').hide();
       $('#three').show();
   }

}, 3000);

$('#one').show(); 
</script>

<div id="one" style="display:none">
<p>content for div #one</p>
</div>

<div id="two" style="display:none">
<p>content for div #two</p>
</div>

<div id="three" style="display:none">
<p>content for div three</p>
</div>

chrome 中的控制台正在呕吐：

Unexpected token {

所以 if else 语句似乎有语法错误，但对我来说看起来没问题：(

谁能发现我错过了什么？

【问题讨论】：

您可以在 MDN 上阅读更多关于 if...else 的信息：developer.mozilla.org/en-US/docs/JavaScript/Reference/…
你们太棒了！感谢您发现我在星期一早上打瞌睡的错误！
谁能发现为什么第三个 div 没有出现？ ''
@h0rhay 我已经更新了我的答案
@h0rhay 我已经更新了我的答案。第三个 div 未显示的原因是因为第一个 if 为 true 后从未达到 else if 条件

标签： javascript jquery date

【解决方案1】：

我已经对脚本进行了一些操作，以便您可以添加类，并且项目会在您决定的时间消失。如果内容已过期，它将显示或隐藏。如果需要，您可以添加更多变量和 else if 语句。

我仍在学习 JS 和 jQuery，所以请记住这一点，但一切似乎都按我想要的方式工作，我在控制台中没有错误。

https://jsfiddle.net/medel/qhgrtwzm/2/

HTML

<div class="houdini" style="display:none">
  <p>content for div #one</p>
</div>

启用 jQuery 的 JS 1.8.3

window.setInterval(function() {

  var current = new Date();
  var expiry = new Date("January 19, 2016 17:39:00")

  if (current.getTime() > expiry.getTime()) {
    $('.houdini').hide();

  } else if (current.getTime() < expiry.getTime()) {
    $('.houdini').show();
  }

}, 0);

【讨论】：

【解决方案2】：

如果需要，您可以检查工作中的jsfiddle

问题是您需要else if else (current.getTime() > expiry2.getTime()) {

更新 1

用</div> 关闭每个div。 Fiddle也更新了

更新 2

你也有我认为的逻辑错误。如果要激活条件(current.getTime() > expiry2.getTime())，它不能作为第一个条件(current.getTime()>expiry.getTime()) 的else。将else if 更改为if，它应该可以工作，尽管为了进一步优化代码，您可以将第二个if 包含在第一个if 中（考虑到expiry 总是小于expiry2）

【讨论】：

【解决方案3】：

你在else之后忘记了if：

else if (current.getTime() > expiry2.getTime()) {

【讨论】：

【解决方案4】：

Jacob George 的回答非常棒！发布这个以防它帮助任何人。我必须修改日期/时间格式，以便与 Internet Explorer 兼容 UTC/GMT。我还对逻辑进行了重新排序，使其像瀑布一样触发，根据到期时间仅显示一个 div，如果当前时间早于 expiry 值，则不显示 div。

Javascript：

window.setInterval(function() {

  var current = new Date();
  var expiry = new Date('2015-12-03T02:00:00.000-08:00')
  var expiry2 = new Date('2015-12-04T02:00:00.000-08:00')
  var expiry3 = new Date('2015-12-05T02:00:00.000-08:00')

  if (current.getTime() > expiry3.getTime()) {
    $('#one').hide();
    $('#two').hide();
    $('#three').show();
  } else if (current.getTime() > expiry2.getTime()) {
    $('#one').hide();
    $('#two').show();
    $('#three').hide();
  } else if (current.getTime() > expiry.getTime()) {
    $('#one').show();
    $('#two').hide();
    $('#three').hide();
  }

}, 3000);

【讨论】：

【解决方案5】：

您忘记了 else 语句中的 if。您的 if-else 块应如下所示：

if (current.getTime() > expiry.getTime()) {
    $('#one').hide();
    $('#two').show();
} else if (current.getTime() > expiry2.getTime()) {
    $('#two').hide();
    $('#three').show();
}

【讨论】：