再次在运行之前将条件设置为 setTimeout

Question

我需要使用 setTimeout 或 setInterval 做一些事情，但无法让它工作。

假设我有一个图像，当 window 完成渲染时加载，用户在 20 秒内保持空闲 and/or 做事，当这 20 秒过去后用户做某事（点击，移动或滚动）我想刷新图像，但是如果时间是 20 秒并且用户空闲我想一直计算时间直到用户在清除值并重新开始观看之前进行交互。

案例：

图像加载、用户移动、保持空闲、点击（所有这些都在 20 秒内），然后用户在这 20 秒后进行交互，以便图像刷新、setTimeout 或 setInterval 清除并重新开始
图像加载、用户移动、保持空闲（所有这些都发生在 20 秒内），然后用户在这 20 秒后保持空闲，因此图像不会刷新并且 setTimeout 或 setInterval 会继续计数而不是清除等待用户再次开始的交互

无论如何我都做不到这个方法

我有这样的东西不起作用：

var refresh = setTimeout(function(){
    console.log('Inside waiting for user interaction');
    //If user is idle while inside here keep waiting and counting

    $(document).on('mousemove click', function(){
        console.log('Inside because of user interaction');
        //Refresh image and then clearTimeOut
        clearTimeout(refresh);
        //Start again waiting for 20 seconds to get inside
        setTimeout(refresh);
    });
}, 20000); //20 seconds before waiting for user interaction

非常感谢！

Answer 1

有一个标志来指示计时器是否已结束，并在您处理鼠标时检查该标志 activity。

var elapsed, timer;

function refresh() {
    //... stuff you want to do ...
    resetTimer();
}

function resetTimer() {
    if (!elapsed) {
        clearTimeout(timer);
    }
    elapsed = false;
    timer = setTimeout(function () {
        elapsed = true;
    }, 10000);
}

function mouseActivity() {
    if (elapsed) refresh();
}

演示 fiddle：http://jsfiddle.net/7768nbze/

再次在运行之前将条件设置为 setTimeout

setTimeout with condition inside before running again

javascript

jquery

settimeout

setinterval

再次在 运行 之前将条件设置为 setTimeout

setTimeout with condition inside before running again

javascript

jquery

settimeout

setinterval

再次在运行之前将条件设置为 setTimeout