我需要使用setTimeout或setInterval做一些事情,但无法使其正常工作。
假设我有一个图像在窗口完成渲染时加载,用户在20秒内保持空闲和/或处理,当这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
非常感谢!
答案 0 :(得分:2)
有一个标志来指示计时器是否已经过去,并在您处理鼠标活动时检查该标志。
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();
}