Loading

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

需求

有的时候我们需要防止用户对应用进行截图。

思路

window.onfocuswindow.onblur 可以监听当前页面被其他应用覆盖的情况,而visibilitychange无法监测到

示例

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script>
      // document.addEventListener('visibilitychange', function () {
      //   // 用户离开了当前页面
      //   if (document.visibilityState === 'hidden') {
      //     document.title = '页面不可见'
      //   }

      //   // 用户打开或回到页面
      //   if (document.visibilityState === 'visible') {
      //     document.title = '页面可见'
      //   }
      // })

      window.onfocus = function () {
        document.title = '页面聚焦'
      }
      window.onblur = function () {
        document.title = '页面失去焦点'
      }
    </script>
  </body>
</html>

参考

https://www.cnblogs.com/csuwujing/p/10315309.html

posted @ 2024-09-03 07:54  ^Mao^  阅读(61)  评论(0编辑  收藏  举报