javascript 根据日期显示/隐藏 div
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/13121448/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Show/Hide divs based on date
提问by h0rhay
I'm trying to show hide divs based on date and am experimenting with the following code:
我正在尝试根据日期显示隐藏 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>
Console in chrome is throwing up :
chrome 中的控制台正在抛出：
Unexpected token {
So it seems there's a syntax error with the if else statement, but it looks ok to me : (
所以似乎 if else 语句存在语法错误，但对我来说看起来没问题:(
Can any one spot what I'm missing?
任何人都可以发现我缺少的东西吗？
回答by Jacob George
You can check the working jsfiddleif you want
如果需要，您可以检查正在运行的jsfiddle
The issue is you require an else ifat else (current.getTime() > expiry2.getTime()) {
问题是你需要一个else ifatelse (current.getTime() > expiry2.getTime()) {
UPDATE 1
更新 1
Close each div with </div>. Fiddleis also updated
用 关闭每个 div </div>。小提琴也更新了
UPDATE 2
更新 2
You also have what I think is a logical error. If you want the condition (current.getTime() > expiry2.getTime())to be activated, it cant come as the elseof the first condition (current.getTime()>expiry.getTime()). Change the else ifto if, it should work then, although to further optimize the code, you could enclose the second ifwithin the first if(considering that expiryis always less than expiry2)
你也有我认为的逻辑错误。如果你想(current.getTime() > expiry2.getTime())激活条件，它不能作为else第一个条件的(current.getTime()>expiry.getTime())。更改else if为if，它应该可以工作，尽管为了进一步优化代码，您可以将第二个if包含在第一个中if（考虑到expiry始终小于expiry2）
回答by VisioN
You forgot about ifafter else:
你忘了if后else：
else if (current.getTime() > expiry2.getTime()) {
回答by J. Medel
I've manipulated the script a bit so that you can add the class and the item will disappear on the time you decide. It will either show or hide if the content has expired. You can add more variables and else if statements, if need be.
我对脚本进行了一些操作，以便您可以添加类，并且该项目将在您决定时消失。如果内容已过期，它将显示或隐藏。如果需要，您可以添加更多变量和 else if 语句。
I'm still learning JS and jQuery so please keep this in mind but everything seems to work the way I wanted it to and I have no errors in the Console.
我仍在学习 JS 和 jQuery，所以请记住这一点，但一切似乎都按我想要的方式工作，并且控制台中没有错误。
https://jsfiddle.net/medel/qhgrtwzm/2/
https://jsfiddle.net/medel/qhgrtwzm/2/
HTML
HTML
<div class="houdini" style="display:none">
<p>content for div #one</p>
</div>
JS with jQuery enabled 1.8.3
启用 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);
回答by Ryan
Jacob George's answer is excellent! Posting this up in case it helps anyone. I had to modify the date/time format for UTC/GMT compatibility with Internet Explorer. I also reordered the logic so it triggers like a waterfall, only showing one div based on the expiry time, or no div's if the current time is before the expiryvalue.
雅各布乔治的回答非常好！发布这个以防它对任何人有帮助。为了与 Internet Explorer 兼容，我不得不修改日期/时间格式。我还重新排序了逻辑，使其像瀑布一样触发，仅根据到期时间显示一个 div，如果当前时间在该expiry值之前，则不显示 div 。
Javascript:
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);
