如何创建一个倒计时，到特定时间后重置？

Question

首先，我不是很理解JavaScript，但我知道足够的东西来为页面编写小脚本。我的客户需要我为网站执行以下操作：

1. 找到用户电脑上的本地时间。
2. 从该本地时间减去下午6点。
3. 在倒计时中显示此时间或仅显示一条声明，向用户说明剩余多少时间可以进行当天的送货。
4. 下午6点后，时间将重置或消失，直到下一个工作日。

到目前为止，我已经能够创建从本地计算机获取时间的逻辑。我曾尝试使用datejs，但它无法计算一天中的小时数。

这是我目前拥有的代码：

var currentTime = new Date()
var hours = currentTime.getHours()
var minutes = currentTime.getMinutes()

var suffix = "AM";
if (hours >= 12) 
{
  suffix = "PM";
  hours = hours - 12;
 }

var suffix = "AM";

if (hours >= 12) 
{
  suffix = "PM"; 
  hours = hours - 12;
}

if (hours == 0) 
{
  hours = 12;
}

if (minutes < 10)
  minutes = "0" + minutes;

document.write("<b>" + hours + ":" + minutes + " " + suffix + "</b>");

- Nina Morena

---

除了其他测试之外，记得测试夏令时日期，否则“x小时”的输出可能会偏差1小时。 - andyb

Answer 1

这样怎么样？

var currentTime = new Date()
var hours = currentTime.getHours()
var minutes = currentTime.getMinutes()

var suffix = "AM";
if (hours >= 12) {
suffix = "PM";
hours = hours - 12;
  }


if (minutes < 10)
minutes = "0" + minutes

if (suffix == "PM" && hours >= 6)
    {
 document.write("You're too late for next day shipping!");
}
    else
    {
    var hoursLeft = 5 - hours;
var minsLeft = 60 - minutes;
    document.write("<b> You've got " + hoursLeft  + " hours and " + minsLeft + " minutes left to qualify for next day shipping! </b>")
    }

- Giovanni B

---

这假设客户处于相同的时区，这是一个不安全的假设。如何在JavaScript中处理时区偏移...我不确定。 - Giovanni B

@ Giovanni B：您需要获取客户位置（地理位置），然后选择正确的时区。 - atlavis

Answer 2

如果这个网站允许我评论其他人的答案，我会把这个归功于Giovanni，但是由于我还不能评论别人的工作，以下是需要更改的内容。

var currentTime = new Date()
var hours = currentTime.getHours()
var minutes = currentTime.getMinutes()

var suffix = "AM";

if (minutes < 10)
minutes = "0" + minutes

if (hours >= 18)
{
 document.write("You're too late for next day shipping!");
}
else
{
var hoursLeft = 17 - hours;
var minsLeft = 60 - minutes;
if(minsLeft==60){
    minsLeft=0;
    hoursLeft++;
}

document.write("<b> You've got " + hoursLeft  + " and " + minsLeft + " minutes left to qualify for next day shipping! </b>")
}

这是因为在凌晨5点下单的人可能会认为他们必须在接下来的一个小时内提交订单，以便于第二天发货，但实际上他们有13个小时的时间。

编辑：看到你对时区的关注，这里有一篇文章可能会引起你的兴趣。

编辑2：链接错误。正确的链接应该已经发布了，尽管它可能有点过时。

- Scott M

---

тдѓТъюcurrentTimeТў»new Date(2012, 6, 18, 0, 0, 0, 0)№╝їУЙЊтЄ║С╝џТўЙуц║РђюСйаУ┐ўтЅЕСИІ17т░ЈТЌХтњї60тѕєжњЪРђЮ№╝їУђїСИЇТў»18т░ЈТЌХсђѓ - andyb

@andyb 已经编辑修复了。谢谢。 - Scott M

@NinaMorena 我在 if 检查中犯了一个愚蠢的错误，只使用了 = 而不是 ==。现在它不应该再出现这个问题了。 - Scott M

如果 var currentTime = new Date(2012, 2, 25, 0, 0, 0, 0);，对于英国来说这是夏令时的一天，会损失1个小时，那么输出应该 技术上 是剩余 17小时0分钟。不过用户是否会更加困惑于此输出是另一个问题！我并不是要挑毛病，只是想向OP指出日期/时间计算的一些危险性。 - andyb

不要啊我的积分！！！嘿，感谢你修复我的代码。我只是匆忙回答了一个几乎正确的答案，没有彻底测试......我真丢脸。@ScottM发现得好。 - Giovanni B

Answer 3

这是一个简单的倒计时器，从函数运行开始的30秒开始，到0结束。在达到0后，它会自动重置计数器。它再次回到30秒，这个过程在循环中继续。

  window.onload = function() {    startCountDown(30,
1000, myFunction); }
function startCountDown(i, p, f) {    var pause = p;    var fn = f;   
var countDownObj = document.getElementById("countDown");
countDownObj.count = function(i) {
      //write out count
      countDownObj.innerHTML = i;
      if (i == 0) {
      //execute function
      //fn();
                startCountDown(30, 1000, myFunction);       //stop
      return;    }    setTimeout(function() {
      // repeat
      countDownObj.count(i - 1);
      },
      pause  
      );    }    //set it going    countDownObj.count(i); }
function myFunction(){};
    </script>

  
   

- Zahidul Hossein Ripon

Answer 4

我昨天也解决了类似的问题，所以这很容易。以下是JavaScript代码：

function start_onload(last_hour){
    var timeout_message = document.getElementById('timeout_message');
    var currentTime = new Date();
    var hours = currentTime.getHours();
    var minutes = currentTime.getMinutes();
    var seconds = currentTime.getSeconds();
    var expire_time = 0; // in seconds
    if (hours<last_hour) {
        expire_time += (last_hour-hours-1)*3600;
        expire_time += (59-minutes)*60;
        expire_time += (59-seconds);
    }
    else {
        timeout_message.innerHTML = 'It\'s after '+last_hour+' o\'clock!';
        return;
    }
    var expire_time = currentTime.getTime() + 1000*expire_time;
    //console.log(expire_time, hours, minutes, seconds, expire_time);
    function countdown_session_timeout() {
        var current_time = new Date().getTime();
        var remaining = Math.floor((expire_time - current_time)/1000);
        if (remaining>0) {
            hours = Math.floor(remaining/3600);
            minutes = Math.floor((remaining - hours*3600)/60);
            seconds = remaining%60;
            timeout_message.innerHTML = 'Countdown will stop in '+ hours + ' hours ' + minutes + ' min. ' + seconds + ' sec.';
            setTimeout(countdown_session_timeout, 1000);
        } else {
            timeout_message.innerHTML = 'Time is up!';
        }
    }
    countdown_session_timeout();
}

完整脚本请查看pastebin.com。

- Stano