こんにちはみんな私はなぜこのコードが機能しないのか疑問に思っています、私はjavascriptに不慣れでそれで遊んでいます。onload関数内に置くと機能せず、理由がわかりません。onload関数には他にもたくさんのコードがありますが、この例では削除しました。とにかく、他のコードは正常に機能しますが、機能しないこの特定のビットだけです。
window.onload = function() {
var i, timer, divide;
i = 0;
divide = 100;
function start() {
timer = self.setInterval("increment()", (1000 / divide));
}
function increment() {
i++;
document.getElementById("timer_out").innerHTML = (i / divide);
}
function stop() {
clearInterval(timer);
timer = null;
}
function reset() {
stop();
i = 0;
document.getElementById("timer_out").innerHTML = (i / divide);
}
}
<div>
<span id="timer_out">0</span>
</br>
<input type="button" value="Start" onclick="start()"/>
<input type="button" value="Stop" onclick="stop()"/>
<input type="button" value="Reset" onclick="reset()"/>
</div>
onloadスコープの外で関数と変数を定義する必要があります。そうしないと、アクセスできません。
var i, timer, divide;
function start() {
if(!timer) {
timer = setInterval("increment()", (1000 / divide));
}
}
function increment() {
i++;
document.getElementById("timer_out").innerHTML = (i / divide);
}
function stop() {
clearInterval(timer);
timer = null;
}
function reset() {
stop();
i = 0;
document.getElementById("timer_out").innerHTML = (i / divide);
}
window.onload = function() {
i = 0;
divide = 100;
}
コメントで述べたように、[開始]を複数回クリックするとタイマーを停止できなくなるバグもあります。これは、2つ(またはそれ以上)のタイマーを作成しているが、最後のタイマーへの参照しかないためです。これを修正if
するには、タイマーが存在するかどうかを確認する簡単なステートメントで十分です。上記のコードはこれを示すように更新されており、実行例は次のとおりです:http://jsfiddle.net/qPvT2/40/
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加