1

私はDOMとHTMLとPHP全体にかなり慣れていないので、これを行う方法に関する情報を探しています. 私が今まで持っているのは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>
4

1 に答える 1

0

最初に 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>
于 2012-03-18T12:06:34.307 に答える