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('离开页面')
  }
})
相关推荐
Irene19914 分钟前
JavaScript 中 this 指向总结和箭头函数的作用域说明(附:call / apply / bind 对比总结)
javascript·this·箭头函数
2501_9219308318 分钟前
ReactNative项目OpenHarmony三方库集成实战:react-native-appearance(更推荐自带的Appearance)
javascript·react native·react.js
还是大剑师兰特21 分钟前
Vue3 中 computed(计算属性)完整使用指南
前端·javascript·vue.js
码云数智-园园35 分钟前
2026 年前端开发趋势:AI 赋能、组件化与跨端一体化的深度融合
开发语言
井川不擦37 分钟前
前端安全通信方案:RSA + AES 混合加密
前端
孜孜不倦不忘初心38 分钟前
Ant Design Vue 表格组件空数据统一处理 踩坑
前端·vue.js·ant design
weixin_4235339939 分钟前
windows11安装飞桨paddlepaddle,python3.13
开发语言
AD_wjk39 分钟前
Android13系统集成方案
前端
Joyee69140 分钟前
RN 的新通信模型 JSI
前端·react native
somebody40 分钟前
零经验学 react 的第6天 - 循环渲染和条件渲染
前端