Menyetel ulang setTimeout


161

Saya memiliki yang berikut ini:

window.setTimeout(function() {
    window.location.href = 'file.php';
}, 115000);

Bagaimana saya bisa, melalui fungsi .click, mengatur ulang penghitung di tengah-tengah penghitungan mundur?


Anda mungkin dapat menggunakan implementasi debounce yang ada.
AturSams

Jawaban:


264

Anda dapat menyimpan referensi ke batas waktu itu, dan kemudian memanggil clearTimeoutreferensi itu.

// in the example above, assign the result
var timeoutHandle = window.setTimeout(...);

// in your click function, call clearTimeout
window.clearTimeout(timeoutHandle);

// then call setTimeout again to reset the timer
timeoutHandle = window.setTimeout(...);

2
Sangat aneh bahwa tidak ada .clear()objek timeout itu sendiri.
Otomatis

16
@ Cort3z itu karena window.setTimeoutmengembalikan angka (ID pengatur waktu) dan bukan "objek batas waktu".
Dan O

2
Ya @DanO: aneh setTimeout tidak mengembalikan objek Timeout. Dalam konteks NodeJS itu.
Ki Jéy

25

clearTimeout () dan berikan referensi setTimeout, yang akan menjadi angka. Kemudian aktifkan kembali:

var initial;

function invocation() {
    alert('invoked')
    initial = window.setTimeout( 
    function() {
        document.body.style.backgroundColor = 'black'
    }, 5000);
}

invocation();

document.body.onclick = function() {
    alert('stopped')
    clearTimeout( initial )
    // re-invoke invocation()
}

Dalam contoh ini, jika Anda tidak mengklik elemen tubuh dalam 5 detik, warna latar belakang akan menjadi hitam.

Referensi:

Catatan: setTimeout dan clearTimeout bukan metode asli ECMAScript, tetapi metode Javascript dari ruang nama jendela global.


9

Anda harus mengingat batas waktu "Timer", membatalkannya, lalu memulai kembali:

g_timer = null;

$(document).ready(function() {
    startTimer();
});

function startTimer() {
    g_timer = window.setTimeout(function() {
        window.location.href = 'file.php';
    }, 115000);
}

function onClick() {
    clearTimeout(g_timer);
    startTimer();
}

1
Menarik bahwa opsi ini telah diabaikan. Yang lain semua tampaknya memerlukan fungsi internal timer untuk diduplikasi, yang kurang kering dan menyakitkan jika ada lebih dari beberapa baris kode untuk mempertahankan dua kali ...
brianlmerritt

8
var myTimer = setTimeout(..., 115000);
something.click(function () {
    clearTimeout(myTimer);
    myTimer = setTimeout(..., 115000);
}); 

Sesuatu di sepanjang garis itu!


2

Penghitung waktu ini akan mengaktifkan kotak tanda "Halo" setelah 30 detik. Namun, setiap kali Anda mengklik tombol reset timer, ini akan menghapus timerHandle kemudian mengaturnya kembali. Setelah dipecat, permainan berakhir.

<script type="text/javascript">
    var timerHandle = setTimeout("alert('Hello')",3000);
    function resetTimer() {
        window.clearTimeout(timerHandle);
        timerHandle = setTimeout("alert('Hello')",3000);
    }
</script>

<body>
    <button onclick="resetTimer()">Reset Timer</button>
</body>

2
var redirectionDelay;
function startRedirectionDelay(){
    redirectionDelay = setTimeout(redirect, 115000);
}
function resetRedirectionDelay(){
    clearTimeout(redirectionDelay);
}

function redirect(){
    location.href = 'file.php';
}

// in your click >> fire those
resetRedirectionDelay();
startRedirectionDelay();

di sini adalah contoh yang diuraikan untuk apa yang sebenarnya terjadi di http://jsfiddle.net/ppjrnd2L/


1
$(function() {

    (function(){

        var pthis = this;
        this.mseg = 115000;
        this.href = 'file.php'

        this.setTimer = function() { 
            return (window.setTimeout( function() {window.location.href = this.href;}, this.mseg));
        };
        this.timer = pthis.setTimer();

        this.clear = function(ref) { clearTimeout(ref.timer); ref.setTimer(); };
        $(window.document).click( function(){pthis.clear.apply(pthis, [pthis])} );

    })();

});

1

Untuk mengatur ulang timer, Anda perlu mengatur dan menghapus variabel timer

$time_out_handle = 0;
window.clearTimeout($time_out_handle);
$time_out_handle = window.setTimeout( function(){---}, 60000 );

25
Argh, saya menyarankan agar tidak menggunakan nama variabel gaya php dalam javascript. ya, itu akan berhasil, tapi Tuhan, ini membingungkan.
psynnott

0

saya tahu ini adalah utas lama tetapi saya datang dengan ini hari ini

var timer       = []; //creates a empty array called timer to store timer instances
var afterTimer = function(timerName, interval, callback){
    window.clearTimeout(timer[timerName]); //clear the named timer if exists
    timer[timerName] = window.setTimeout(function(){ //creates a new named timer 
        callback(); //executes your callback code after timer finished
    },interval); //sets the timer timer
}

dan Anda memohon menggunakan

afterTimer('<timername>string', <interval in milliseconds>int, function(){
   your code here
});
Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.