js 怎样判断用户是否在浏览当前页面? 10

比如说我用浏览器打开了好多页面,怎样判断我这个页面是否正在被用户浏览。我想实现的功能是那个页面不断的像服务器get数据回来监测是否有更新。但是如果用户不在浏览这么页面的话... 比如说我用浏览器打开了好多页面,怎样判断我这个页面是否正在被用户浏览。
我想实现的功能是
那个页面不断的像服务器get数据回来监测是否有更新。
但是如果用户不在浏览这么页面的话,那个页面还是会不断的给服务器get数据,这样子用户多了肯定会造成服务器压力。
还有什么好办法没?
展开
 我来答
大野瘦子
高粉答主

2019-10-26 · 繁杂信息太多,你要学会辨别
知道小有建树答主
回答量:1227
采纳率:100%
帮助的人:32.7万
展开全部

这样:

//网页当前状态判断var hidden, state, visibilityChange; if (typeof document.hidden !== 

"undefined") {

hidden = "hidden";

visibilityChange = "visibilitychange";

state = "visibilityState";} else if (typeof document.mozHidden !== "undefined") {

hidden = "mozHidden";

visibilityChange = "mozvisibilitychange";

state = "mozVisibilityState";} else if (typeof document.msHidden !== "undefined") {

hidden = "msHidden";

visibilityChange = "msvisibilitychange";

state = "msVisibilityState";} else if (typeof document.webkitHidden !== "undefined") {

hidden = "webkitHidden";

visibilityChange = "webkitvisibilitychange";

state = "webkitVisibilityState";}// 添加监听器,在title里显示状态变化

document.addEventListener(visibilityChange, function() {

document.title = document[state];}, false);//初始化页面状态document.title = 

document[state];

扩展资料:

注意事项

浏览器对象有onfocus 和 onblur事件可以监听。但是触发这两个事件的前提是页面之前是focus过的。也就是说页面刚刚渲染完,用户在没有页面上任何操作时,页面是不会正常监听这两个事件的;或者页面在打开状态下,但是触发了onblur之后并无页面操作的情况下也不会正常监听这两个事件。

直到,用户操作页面触发focus,之后离开页面才会触发blur,再次点击到当前页面时才会触发focus,如此反复都会触发相应的事件。

触发onblur事件的情况:

1、在chrome浏览器下,点击console面板也会触发blur事件,同样的,前提是之前是focus的状态。

2、页面最小化。

3、浏览器切换tab页面。

4、页面中的任何弹窗。

5、focus状态下切换到其他应用。

lyz810
推荐于2017-09-15 · 知道合伙人互联网行家
lyz810
知道合伙人互联网行家
采纳数:7531 获赞数:31775
前端开发工程师

向TA提问 私信TA
展开全部

可以通过document.hidden属性判断当前页面是否是激活状态。

兼容性:IE10+,Firefox10+,Chrome14+,Opera12.1+,Safari7.1+

兼容性写法示例:

var hiddenProperty = 'hidden' in document ? 'hidden' :    
    'webkitHidden' in document ? 'webkitHidden' :    
    'mozHidden' in document ? 'mozHidden' :    
    null;
var visibilityChangeEvent = hiddenProperty.replace(/hidden/i, 'visibilitychange');
var onVisibilityChange = function(){
    if (!document[hiddenProperty]) {    
        console.log('页面非激活');
    }else{
        console.log('页面激活')
    }
}
document.addEventListener(visibilityChangeEvent, onVisibilityChange);
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
马后雷鼓下扬州5058
2013-04-16 · TA获得超过4321个赞
知道小有建树答主
回答量:693
采纳率:33%
帮助的人:795万
展开全部

你可以使用 onblur 和 onfocus 判断页面是否在最前端(获取焦点)

如果 onblur,停止向服务器请求,当 onfocus,继续请求


下面这个例子可以更好的演示我上面说的,你只是需要把输出数字换为 ajax 的工作。

打开页面,先输出几个数字,转到其它页面,等待几秒,再回去,数字应该接着上次离开时候的值继续输出。


<script type="text/javascript">
var count = 1;
var interval_output = null;

function output_number() {
document.body.innerHTML += (count + " ");
count++;
}

// window 失去焦点,停止输出
window.onblur = function() {
clearInterval(interval_output);
};

// window 每次获得焦点
window.onfocus = function() {
// 每 1 秒在页面输出一个数
interval_output = setInterval(function() {
output_number();
}, 1000);
}
</script>
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
也许当时还小
2013-04-17
知道答主
回答量:2
采纳率:0%
帮助的人:3306
展开全部
可以给整个页面添加mouseover和mouseout事件,如果用户正在浏览该页面,基本上鼠标是在这个页面上的。这里,当over事件一时触发可以判断用户正在浏览页面,当out触发,则认为用户不关注页面了。
追问
先判断鼠标的位置。。如果能找到鼠标就向服务器get你看能不能行的通?
如果加mouseover和mouseout事件怎么用呢?鼠标一移动就向服务get吗?
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
fxyandy
2013-04-17 · TA获得超过1402个赞
知道小有建树答主
回答量:838
采纳率:0%
帮助的人:591万
展开全部
1.监听cookis
2.HTML5新功能:localStorage 用storage事件监听别的页面

有时间百度下。
别忘了给分。
追问
不明白。需要监听服务器里面数据的变化。。。
为什么要监听本地的呢?
不过大兄弟,你这个localStorage很好用哈哈。比传统的cookie方便多了
本回答被网友采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 更多回答(6)
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式