js 检测浏览器 鼠标状态 页面状态

原理：浏览器判断是否切换页面主要是判断 用户是否切换 选项卡 tab

1 方法：

（1） document.hidden
　　 返回值为true：表示被隐藏，不可见
　　 返回值为false：表示未被隐藏，可见

（2）document.visibilityState
　　 返回值为 visible：表示是可见状态
　　 返回值为 hidden：表示隐藏状态

检测用户是否切换页面

2 页面是否最小化

if (document.hidden !== undefined) {
  document.addEventListener('visibilitychange', () => {
    // alert(document.hidden);
    if(document.hidden){
      alert('系统检测到您有切屏行为！！！');
    }
  })
}

window.addEventListener("visibilitychange", function () {
  if (document.hidden) {
    alert('系统检测到您有切屏行为！！！');
  }
});

鼠标是否移出浏览器

window.onmouseout = function (event) {
  if (event.toElement === null) {
    alert('警告，鼠标离开浏览器！！！');
  }
}

$(document).mouseleave(function () {
  alert('警告，鼠标离开浏览器！！！');
});

$(document).mouseenter(function () {
  alert('鼠标进入浏览器');
});