reset timer on click using javascript

Question

i have this JS Code:

<script>
$(document).ready(function () {
    window.setTimeout(function () {
        $('#logout_warning').reveal();
    }, 6000)
});
$(document).ready(function () {
    window.setTimeout(function () {
        location.href = "/login/logout.php?url=/index.php?r=inactivity";
    }, 12000)
});
</script>

it displays a DIV after X Seconds then redirects the page after Y Seconds

is there a way to create a link that will reset the timer back to X seconds and without having to refresh the page?

you need to bind a clearTimeout() to the click of your anchor element to reset your first setTimeout — scrowler
– scrowler, Commented Feb 27, 2014 at 1:06

Paul S. · Accepted Answer · 2014-02-27 01:13:38Z

1

You could write a wrapper for setTimeout like this

function myTimeout(fn, delay) {
    var o = {i: null};
    o.cancel = function () {
        if (o.i) window.clearTimeout(o.i);
    };
    o.reset = function () {
        if (o.i) window.clearTimeout(o.i);
        o.i = window.setTimeout(fn, delay);
    };
    o.reset();
    return o;
}

Then

// common (ancestor?) scope
var t;

// descendant scope, set
t = myTimeout(function () {
    $('#logout_warning').reveal();
}, 6000);

// descendant scope where you attach listener to your link
$('#my_link').on('click', function () {
    t.reset(); // re-start the timeout
    return false;
});

answered Feb 27, 2014 at 1:13

Paul S.

66.6k9 gold badges129 silver badges143 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

reset timer on click using javascript

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related