Question

我对DOM以及整个HTML和PHP Stuff相当新，所以我正在寻找有关如何执行此操作的一些信息。我到现在为止是一个Javascript。现在我想/必须使用DOM来显示这个脚本。（仅供参考：我正在为Moodle实施一些事情，这样就可以这样做了）

我发现的DOM是我可以更改不同节点的值。我发现自己的问题是我发现的所有例子都是这样的。点击一个按钮就会发生一些事情。没关系，但现在我希望我的脚本每秒运行一次，这样我就可以让需要它的人看到时间不多了。

我希望我能给你足够的信息，希望你能帮助我。谢谢你试图帮助我。

var running = false
var endTime = null
var timerID = null
// totalMinutes the amount of minutes is put into
var totalMinutes = 3;

function startTimer() {
    // running is being started and the current time is put into the variable
    running = true
    now = new Date()
    now = now.getTime()
    // Variable endTime gets the time plus the maximum time
    endTime = now + (1000 * 60 * totalMinutes);
    showCountDown()
}

function showCountDown() {
    // same as startTimer, time is saved in variable now
    var now = new Date()
    now = now.getTime()
    if (endTime - now <= 0) {
       // Variable timerID gets clearTimeout -->http://de.selfhtml.org/javascript/objekte/window.htm#clear_timeout
       clearTimeout(timerID)
       // boolean running set to false
       running = false
       alert("Ihr Resultat wird nun ausgewertet!")
    } else {
        // delta is being calculated
        var delta = new Date(endTime - now)
        var theMin = delta.getMinutes()
        var theSec = delta.getSeconds()
        var theTime = theMin
        // show seconds and minutes
        theTime += ((theSec < 10) ? ":0" : ":") + theSec
        document.getElementById('CheckResults').innerHTML = " (&Uuml;bung in " + theTime + " Minuten abgelaufen)"
        if (running) {
            timerID = setTimeout("showCountDown()",900)
        }
    }
}
</script>

Answer 1

您可能希望使用window.setInterval作为开始。这是一个简短的例子。创建一个空白的html页面，将脚本放入head部分，将标记放入body部分。我无法使用正确的html和body标签发布它

<script>
    function countDownTimer(msecGranularity, output) {
        var secRunningTime, startTime, endTime, onFinish, interval;

        function heartBeat() {
            var diff = endTime - new Date();
            output.innerHTML = diff / 1000;
            if (diff < 0) {
                window.clearInterval(interval);
                onFinish();
            };
        };

        this.start = function (secRunningTime, finishHandler) {
            onFinish = finishHandler;
            startTime = new Date();
            endTime = startTime.setSeconds(startTime.getSeconds() + secRunningTime);
            interval = window.setInterval(heartBeat, msecGranularity);
        }
    };

    function startTimer(duration, granularity) {
        var output = document.createElement("div");
        document.getElementById("timerOutputs").appendChild(output);
        var t = new countDownTimer(granularity, output);
        t.start(duration, function () { output.innerHTML = 'TIMER FINISHED' });
    };
</script>

在HTML中放置这些以启动计时器类。

<button onclick="startTimer(60,100)">Start a new 60 seconds timer with 100 msec granularity</button><br />
<button onclick="startTimer(600,1000)">Start a new 600 seconds timer with 1000 msec granularity</button>

<div id="timerOutputs">
</div>

使用DOM显示countdowntimer脚本

1 个答案: