去评论
dz插件网

让你的discuz论坛能留住用户给网站添加Page Visibility API判断用户浏览器tab页是否处于激活状态返回小提示的技巧

admin
2023/05/11 15:32:54
让你的discuz论坛能留住用户给网站添加Page Visibility API判断用户浏览器tab页是否处于激活状态返回小提示的技巧:
实现效果:(插件网自己也用了,可以对着插件网页面右键查看网页源代码查看到~)


在这个示例中,我们使用了 window 对象的 focus 和 blur 事件来监听页面的激活和失去焦点事件。当页面被激活时,会触发 focus 事件,此时我们可以显示提示信息;当页面失去焦点时,会触发 blur 事件,此时我们也可以显示提示信息。

需要注意的是,需要实现两个方面:判断页面是否处于激活状态,判断页面是否处于当前的 tab 页中。

这里使用的是:JavaScript 中的 Page Visibility API 来实现。该 API 可以检测页面是否处于活动状态,如果页面不处于活动状态,则可以触发一些事件,例如显示提示信息。

实现方法很简单,
在 后台 —— 全局 —— 第三方统计代码 直接添加如下:(不影响SEO)

完整代码直接如下下面:
[此处包含隐藏内容,如果需要查看请回复]