jq/js检测鼠标指针移动离开页面

通过 mouseout 鼠标事件,判断鼠标去往哪个元素

知识点:relatedTarget 事件属性


定义和用法

relatedTarget 事件属性返回与事件的目标节点相关的节点。

对于 mouseover 事件来说,该属性是鼠标指针移到目标节点上时所离开的那个节点。

对于 mouseout 事件来说,该属性是离开目标时,鼠标指针进入的节点。

对于其他类型的事件来说,这个属性没有用。

jq

javascript 复制代码
$(document).on('mouseout',function(e){
        if (!e) var e= window.event
        var to = e.relatedTarget || e.toElement
        if (!to || to.nodeName == "HTML") {
            console.log("离开窗口");
        }
    })

js

javascript 复制代码
document.body.addEventListener('mouseout', (e) => {
  if (!e) var e= window.event
  var to = e.relatedTarget || e.toElement
  if (!to || to.nodeName == "HTML") {
    console.log('离开页面')
  }
})
相关推荐
晔子yy9 分钟前
【JAVA探索之路】从头开始讲透、实现单例模式
java·开发语言·单例模式
遇见你...2 小时前
TypeScript
前端·javascript·typescript
Highcharts.js2 小时前
Highcharts Grid 中文站正式上线:表格数据处理的全新选择
前端·javascript·数据库·表格数据·highcharts·可视化图表·企业级图表
阿正的梦工坊5 小时前
JavaScript 微任务与宏任务完全指南
开发语言·javascript·ecmascript
懂懂tty5 小时前
CRA 迁移 Rspack(实战)
前端·架构
知行合一。。。6 小时前
Python--05--面向对象(属性,方法)
android·开发语言·python
青梅橘子皮6 小时前
C语言---指针的应用以及一些面试题
c语言·开发语言·算法
浅时光_c6 小时前
3 shell脚本编程
linux·开发语言·bash
小码哥_常7 小时前
Kotlin 助力 Android 启动“大提速”
前端
Evand J7 小时前
【三维轨迹目标定位,CKF+RTS,MATLAB程序】基于CKF与RTS平滑的三维非线性目标跟踪(距离+方位角+俯仰角)
开发语言·matlab·目标跟踪