在警报框中创建倒计时计时器答案

【问题标题】：Backcountdown Timer creation in the alertbox在警报框中创建倒计时计时器
【发布时间】：2014-02-28 05:39:42
【问题描述】：

我需要创建一个计时器，它会显示在 javascript 的警报框中，它会从 4 分钟开始倒计时到 0.. 时间结束时，它应该停止计时器。我希望用 Javascript 创建的所有内容。我已尝试使用从该链接获得的以下代码： Timer in Javascript

但它不适用于我。我已经这样做了::

<script>
     window.onload = CreateTimer("timer", 30);
        var Timer;
        var TotalSeconds;
        function CreateTimer(TimerID, Time) {

            Timer = document.getElementById(TimerID);
            TotalSeconds = Time;
            UpdateTimer()
            window.setTimeout("Tick()", 1000);
        }

        function Tick() {
            if (TotalSeconds <= 0) {
                alert("Time's up!")
                return;
            }
            TotalSeconds -= 1;
            UpdateTimer()
            window.setTimeout("Tick()", 1000);
        }

        function UpdateTimer() {
            var Seconds = TotalSeconds;

            var Days = Math.floor(Seconds / 86400);
            Seconds -= Days * 86400;

            var Hours = Math.floor(Seconds / 3600);
            Seconds -= Hours * (3600);

            var Minutes = Math.floor(Seconds / 60);
            Seconds -= Minutes * (60);


            var TimeStr = ((Days > 0) ? Days + " days " : "") + LeadingZero(Hours) + ":" + LeadingZero(Minutes) + ":" + LeadingZero(Seconds)


            Timer.innerHTML = TimeStr;
        }


        function LeadingZero(Time) {

            return (Time < 10) ? "0" + Time : +Time;

        }
</script>


 <div class="page">


        <div id='timer' style="float: left; width: 50%; background-color: red; color: white;"></div>

</div>

【问题讨论】：

标签： javascript jquery asp.net-mvc-3 logic countdowntimer

【解决方案1】：

希望对你有帮助。

    window.onload = CreateTimer("timer", 30);
      var Timer;
      var TotalSeconds;
      function CreateTimer(TimerID, Time) { 
        Timer = document.getElementById(TimerID);
        TotalSeconds = Time;
        UpdateTimer()
        window.setTimeout(Tick, 1000); // remove double quote
      }

      function Tick() {
        if (TotalSeconds <= 0) {
        alert("Time's up!")
        return;
      }
      TotalSeconds -= 1;
      UpdateTimer()
      window.setTimeout(Tick, 1000); // remove double quote
   }

   function UpdateTimer() {
      var Seconds = TotalSeconds;

      var Days = Math.floor(Seconds / 86400);
      Seconds -= Days * 86400;

      var Hours = Math.floor(Seconds / 3600);
      Seconds -= Hours * (3600);

      var Minutes = Math.floor(Seconds / 60);
      Seconds -= Minutes * (60);


      var TimeStr = ((Days > 0) ? Days + " days " : "") + LeadingZero(Hours) + ":" +        LeadingZero(Minutes) + ":" + LeadingZero(Seconds)


      Timer.innerHTML = TimeStr;
   }


  function LeadingZero(Time) {

      return (Time < 10) ? "0" + Time : +Time;

  }

评论在我进行更改的地方。此外，您还需要根据要求修改代码，因为无论时间是否剩余，秒数等于 0 时都会显示警报消息。我不知道您对此的要求，我没有触及该代码。请点击此链接获取live demo。

【讨论】：