时间戳

首页 > 解决方案 > 倒数计时器执行外部函数

javascript - 倒数计时器执行外部函数

问题描述

我正在做一个使用倒数计时器的测验，该计时器持续 40 分钟，代码如下：

function startTimer(duration, display) {
    var timer = duration, minutes, seconds;
    setInterval(function () {
        minutes = parseInt(timer / 60, 10)
        seconds = parseInt(timer % 60, 10);

        minutes = minutes < 10 ? "0" + minutes : minutes;
        seconds = seconds < 10 ? "0" + seconds : seconds;

        display.textContent = minutes + ":" + seconds;

        if (--timer < 0) {
            clearInterval(__timer);
            timer = duration;
        }
    }, 1000);
}

window.onload = function () {
    var fortyMinutes = 60 * 40,
        display = document.querySelector('#time');
    startTimer(fortyMinutes, display);
};

我需要它，当它结束时，执行以下函数，以便将分数发送到 mysql 中的表，并且不要让用户继续回答：

function showScores() {
    var gameOverHTML = "<br><h1>Haz terminado, puedes proceder a abandonar la applicación.<br> Puedes hacer uso de los botones en la barra de navegación</h1>";
    gameOverHTML += "<h2 id='score'> Tu Resultado: " + quiz.score + "</h2>";
    var element = document.getElementById("quiz");
    element.innerHTML = gameOverHTML;

    $.ajax({
            type: "POST",
            url: "addanswer.php",
            datatype: "text",
            data: "TotalScore=" + quiz.score,
            success: function(guardar){
                console.log ("Datos guardados correctamente");
            }            
        }
    )
};

我怎样才能做到这一点？

标签： javascriptphpmysqlajax

解决方案

您可以将函数作为回调发送给您：

function startTimer(duration, display, cb) {
    var timer = duration, minutes, seconds;
    setInterval(function () {
        minutes = parseInt(timer / 60, 10)
        seconds = parseInt(timer % 60, 10);

        minutes = minutes < 10 ? "0" + minutes : minutes;
        seconds = seconds < 10 ? "0" + seconds : seconds;

        display.textContent = minutes + ":" + seconds;

        if (--timer < 0) {
            clearInterval(__timer);
            timer = duration;
        }
        // callback execution
        cb();
    }, 1000);
}

function showScores() {
    var gameOverHTML = "<br><h1>Haz terminado, puedes proceder a abandonar la applicación.<br> Puedes hacer uso de los botones en la barra de navegación</h1>";
    gameOverHTML += "<h2 id='score'> Tu Resultado: " + quiz.score + "</h2>";
    var element = document.getElementById("quiz");
    element.innerHTML = gameOverHTML;

    $.ajax({
            type: "POST",
            url: "addanswer.php",
            datatype: "text",
            data: "TotalScore=" + quiz.score,
            success: function(guardar){
                console.log ("Datos guardados correctamente");
            }            
        }
    )
};

window.onload = function () {
    var fortyMinutes = 60 * 40,
        display = document.querySelector('#time');
    // new callback param
    startTimer(fortyMinutes, display, showScores);
};

推荐阅读