実行時にJavascriptで変数をリセットしますか？

Question

私はこの機能を使用して、15秒後にボタンを自動クリックします。問題は、オプションの実行後にユーザーがページを離れず、同じページで再度実行される可能性がありますが、タイマーが続行されることです。実際には、タイマーは自分で操作しても続けられます。

<script type="text/javascript"> 
time = 15; 
interval = setInterval(function() { 
    time--; 
    document.getElementById('Label1').innerHTML = "You must choose in " + time + " seconds" 
    if (time == 0) { 
     // stop timer 
     clearInterval(interval); 
     // click 
     document.getElementById('thebutton').click();  
    } 
}, 1000) 

</script> 

ので、このスクリプトは15秒にタイマーと「押し」は「thebutton」を実行する必要があり、その後、タイマーはカウントを停止する必要がありますし、もう一度実行するまでリセット。 15秒前にボタンを手動で押すと、リセットされます。

<input type='submit' id='thebutton' value='Done'></input> 

これは明らかです。私はまだ新しいと学習です。

Answer 1

基本時間を設定してからそれをリセットします。

<script type="text/javascript"> 
time = 15; 
baseTime = 15; 
interval = setInterval(function() { 
    time--; 
    document.getElementById('Label1').innerHTML = "You must choose in " + time + " seconds" 
    if (time == 0) { 
     // stop timer 
     clearInterval(interval); 
     // click 
     document.getElementById('thebutton').click(); 
     time = baseTime; 
     return false; 


    } 
}, 1000) 

</script> 

Answer 2

あなただけ、あなたが代わりのsetInterval（ののsetTimeout（）関数）を使用する必要があり、ボタンを15秒後に一度クリックすることにしたい場合。

次に、ユーザーがボタンをクリックしたときに自動クリックが行われないようにするには、ボタンにonClickハンドラを追加してclearTimeout（）を呼び出す必要があります。

Answer 3

秒をカウントダウンするときにラベルを更新したいとしますか？タイマーの開始方法が不明です。以下のコードをチェックして、期待通りのものかどうか確認してください。

var time, interval; 
 

 
function stopTimer() { 
 
    if (interval) { 
 
    clearInterval(interval); 
 
    interval = null; 
 
    } 
 
    
 
    time = 15; 
 
} 
 

 
function timerAction() { 
 
    $('#lblStatus').text("You must choose in " + time + " seconds"); 
 

 
    if (time-- <= 0) { 
 
    stopTimer(); 
 
    console.log("done!"); 
 
    $("#btnStop").click(); 
 
    } 
 
} 
 

 
function startTimer() { 
 
    stopTimer(); 
 
    timerAction(); 
 
    interval = setInterval(timerAction, 1000); 
 
} 
 

 
$("#btnStart").click(function() { 
 
    startTimer(); 
 
}); 
 

 
$("#btnStop").click(function() { 
 
    stopTimer(); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<span id=lblStatus></span> 
 
<button id='btnStart'>Reset/Start</button> 
 
<button id='btnStop'>Stop</button>

Answer 4

あなたは一度だけ実行したい場合は、あなたが私はあなたがすべきだと思うのコードを見て、最も重要なものを持っていたsetTimeout関数

setTimeout(your code, 15000); 

Answer 5

を使用することができます見ると、ボタンには "onclick"機能がありません。 これは、ボタンをクリックしたとき何かをする関数を置かないため、ボタンをクリックしても何もしないということです。

私は私が役に立てば幸いいくつかのコードを書いた：

let time = 15; 
const label = document.getElementById("Label1"); 
const button = document.getElementById("thebutton"); 

const getText =() => `You must choose in ${time} seconds`; 

const interval = setInterval(() => { 
    time--; 
    label.innerHTML = getText(); 
    if (time === 0) { 
    // stop timer 
    clearInterval(interval); 
    // click 
    button.click(); 
    } 
}, 1000); 

const stopTime =() => { 
    clearInterval(interval); 
    time = 15; 
    label.innerHTML = getText(); 
}; 

し、HTML内でこのような何か：

<input type='submit' id='thebutton' value='Done' onclick="stopTime()" /> 

は最後に、私はそれができた、私はコードを歩く小さなビデオを作ったが役に立つかもしれません：https://youtu.be/ZYS9AcxO3d4

素晴らしい一日を！