[英]How can I execute a setTimeout() only when the user is present (with the mouse movement) with jQuery
I have a function that updates a <div />
via AJAX: 我有一个通过AJAX更新
<div />
的函数:
function update() {
<!-- .ajax() -->
setTimeout(update(), 3000);}
}
What I need is that this is not executed when the user is not present on the website, so if there is no movement of the mouse (we will suppose that if move it is in the website) it will not update .mousemove()
. 我需要的是,当用户不在网站上时不会执行此操作,因此,如果没有移动鼠标(我们假设如果在网站上移动鼠标)将不会更新
.mousemove()
。 By the way, there is any other thing that we can do to know is someone is active on the website? 顺便说一句,我们还有其他事情可以做,就是有人在网站上活跃吗?
How can this be done? 如何才能做到这一点? Thank you in advance!
先感谢您!
Edit: probably I explained bad. 编辑:可能我解释不好。 I need to know the way to only update when there is activity.
我需要知道仅在有活动时进行更新的方法。 Like Facebook does with his news feed, the front page.
就像Facebook的头条新闻一样。 Thanks!
谢谢!
You could use a mousemove
handler to track when the user last moved, and then have the process only happen if they last moved the mouse within X seconds. 您可以使用
mousemove
处理程序来跟踪用户最后一次移动的时间,然后仅在用户最后一次在X秒内移动鼠标时才执行此过程。 But of course, if the user is sitting there reading something, or if they're a keyboard-oriented kind of person, that will tend to miss that they are there... So you'd probably want to look at keydown
as well. 但是,当然,如果用户坐在那里阅读某些东西,或者如果他们是一个以键盘为导向的人,那往往会错过他们在那里的信息。因此,您可能还想看看键盘
keydown
。
Here's a mousemove example : 这是mousemove的示例 :
jQuery(function($) {
var count = 0, lastmove = new Date();
$(document).mousemove(function() {
++count;
lastmove = new Date();
$('#display').html("Moved " + count + " times");
});
});
Then your update code could do this: 然后您的更新代码可以做到这一点:
function update() {
if (new Date() - lastmove < 60000) { // 60 seconds
// Really do the update
}
else {
// Check back in a few seconds
setTimeout(update, 3000);
}
}
Off-topic , but you have an error in your update code. 偏离主题 ,但更新代码中有错误。 You have:
你有:
setTimeout(update(), 3000);
...which will call update
immediately and then try to use its return value to schedule something to happen in three seconds. ...这将立即调用
update
,然后尝试使用其返回值来安排三秒钟内发生的事情。 If you want the call to update
to be scheduled to happen in three seconds, leave off the ()
after it: 如果您希望在三秒钟内安排
update
呼叫,请在其后保留()
:
setTimeout(update, 3000);
I think there is no easy way to determine if the user is present 我认为没有简单的方法来确定用户是否在场
I would use a combination of mousemove
, scroll
, keypress
. 我会结合使用
mousemove
, scroll
和keypress
。
I think I might have ended up with something such as this. 我想我可能最终会遇到这样的事情。 Avoids date arithmetic.
避免日期算术。 Only cares whether there's been some activity since the last update().
只关心自上一次update()以来是否有活动。
window.activeFlag = false;
window.updateDelay = 3000;
$(document).bind('mousemove scroll keydown', function(){ activeFlag = true; });
function update() {
if(activeFlag) {
doWork();
activeFlag = false;
}
}
window.setTimeout(update, updateDelay);
edit: I've discovered a flaw in the code. 编辑:我发现了代码中的缺陷。 The following is more appropriate:
以下更合适:
window.activeFlag = false;
window.updateDelay = 3000;
$(document).bind('mousemove scroll keydown', function(){ activeFlag = true; });
function update() {
if(activeFlag) {
doWork();
activeFlag = false;
}
window.setTimeout(update, updateDelay);
}
update();
var bUpdate = false;
function update() {
if(bUpdate){
///perform your ajax request
}
}
$(document).mousemove(function(){
bUpdate = true;
setTimeout(function(){bUpdate=false;}, 3000);}
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.