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('离开页面')
  }
})
相关推荐
仰望.几秒前
vue 表格组件 vxe-table 树表格懒加载支持拖拽排序的详细用法
前端·javascript·vue.js·vxe-table
前端 贾公子2 分钟前
vite-plugin-uni-manifest 升级指南
前端
小码哥_常6 分钟前
iPhone 用户传了张 HEIC,我的前端崩了
前端
程序 代码狂人10 分钟前
切片表与分区表的区别(数据开发面试版)
java·大数据·开发语言·数据仓库·算法
小码哥_常13 分钟前
你发的原图可能暴露你家地址——聊聊图片 EXIF 隐私
前端
java1234_小锋24 分钟前
【技术专题】CSS3 网页技术 - CSS3 优先级
前端·css·css3
meiying88381 小时前
快递单号批量查询Python脚本:从手动到自动化的完整实现
开发语言·python·自动化
鸿蒙开发2 小时前
共享 Schema 与 SchemaFactory
前端·后端·harmonyos
屏什么录2 小时前
录屏超过两小时就卡顿崩盘?从参数调优到代码实现,一文彻底搞定长时间录屏
前端·音视频开发
计算机魔术师2 小时前
950亿怎么拆:Meta给AI基建配的三档弹药
前端