Question

我的代码需要一些帮助，我无法通过倒数计时器获取警报。他们应该在计时器剩下4,3,2分钟时发出警报。我目前根本无法获取警报，有时他们会开火，但是每隔一秒钟就会发出警报，警告＃4; 4＆＃34;会开枪。我需要它去一次......任何帮助将不胜感激

继承我的剧本

var running=false
var endTime=null
var timerID=null

function startTimer(){
    running=true
    now=new Date()
    now=now.getTime()

        endTime=now+(1000*60*5)
        showCountDown()
}

function showCountDown(){
    var now=new Date()
    now=now.getTime()

    if (endTime-now<=239990 && endTime-now>240010){alert("4")};
    if (endTime-now<=179990 && endTime-now>180010){alert("3")};
    if (endTime-now<=119990 && endTime-now>120010){alert("2")};


    if (endTime-now<=0){
        stopTimer()
        alert("Time is up. Put down pencils")
    } else {
        var delta=new Date(endTime-now)
        var theMin=delta.getMinutes()
        var theSec=delta.getSeconds()
        var theTime=theMin
        theTime+=((theSec<10)?":0" : ":")+theSec
        document.forms[0].timerDisplay.value=theTime
        if (running){
            timeID=setTimeout("showCountDown()",1000)
        }
    }
}

function stopTimer(){
    clearTimeout(timeID)
    running=false
    document.forms[0].timerDisplay.value="0.00"
}

更新，抱歉意味着分钟而不是秒

更新2：更改ifs，现在它们开火，但在4秒标记后继续射击

    if (endTime-now<=240010 && endTime-now<=239990){alert("4")};
    if (endTime-now<=180010 && endTime-now<=179990){alert("3")};
    if (endTime-now<=120010 && endTime-now<=119990){alert("2")};

Answer 1

你为什么要叫clearTimeout？ setTimeout只调用一次回调。没有必要清除它。你也可以只有一个变量来存储分钟，直到倒计时结束，并在每次迭代中减少一个。

最简单的解决方案可能如下所示

function startTimer(minutesToEnd) {
  if(minutesToEnd > 0) {
    if(minutesToEnd <= 4) {
      console.log(minutesToEnd);
    }
    setTimeout(startTimer, 60000, minutesToEnd - 1);
  } else {
    console.log("Time is up. Put down pencils")
  }
}

Answer 2

我实际上花了一些时间来研究这个问题。我不知道这是不是你想要的，但我创建了一个计时器库。我有一个工作演示。我玩得很开心。让我知道你的想法：

<强> JS：

(function () {
    var t = function (o) {
        if (!(this instanceof t)) {
            return new t(o);
        }
        this.target = o.target || null;

        this.message = o.message;
        this.endMessage = o.endMessage;

        //setInterval id
        this.si = -1;

        //Initial start and end
        this.startTime = null;
        this.endTime = null;
        this.interTime = null;
        this.duration = o.duration || 1000 * 60 * 5;

        //looping speed miliseconds it is best to put the loop at a faster speed so it doesn't miss out on something
        this.loop = o.loop || 300;

        //showing results miliseconds
        this.show = o.show || 1000;
    };
    t.fn = t.prototype = {
        init: function () {}
    };
    //exporting
    window.t = t;

})();

//Timer Functions --- 
t.fn.start = function () {
    this.startTime = new Date();
    this.interTime = this.startTime.getTime();
    this.endTime = new Date().setMilliseconds(this.startTime.getMilliseconds() + this.duration);

    //returns undefined... for some reason.
    console.log(this.endTime);

    var $this = this;
    this.writeMessage(this.duration);
    this.si = setInterval(function () {
        var current = new Date(),
            milli = current.getTime();

        if (milli - $this.interTime >= $this.show) {
            var left = $this.endTime- milli;
            if (left <= 0) {
                $this.stop();
            } else {
                $this.interTime = milli;
                $this.writeMessage(left);
            }

        }
    }, this.loop);
    return this;
};

t.fn.writeMessage = function(left){
    this.target.innerHTML = this.message + ' ' + Math.floor(left / 1000);
    return this;
};
t.fn.stop = function () {
    //stopping the timer
    clearInterval(this.si);
    this.target.innerHTML = this.endMessage;
    return this;

};

//Not chainable
t.fn.isRunning = function () {
    return this.timer > -1;
};


var timer = t({
    target: document.getElementById('results'),
    loop: 50,
    duration: 10000,
    show: 1000, //default is at 1000 miliseconds
    message: 'Time left: ', //If this is ommited then only the time left will be shown
    endMessage: 'Time is up. Put down your pencils'
}).start();

document.getElementById('stop').onclick = function(){
    timer.stop();
};

<强> HTML：

<div id="results"></div>
<button id="stop">Stop</button>

Demo here

更新：我添加了一些内容 Demo 2

更新2：我修正了10个直接跳到8

的错误

Demo 3

JS-倒数计时器警报

2 个答案: