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('离开页面')
  }
})
相关推荐
kyriewen12 分钟前
AI 生成的代码能跑就行?这 5 个坑迟早炸
前端·javascript·ai编程
kisshyshy16 分钟前
🍦 雪糕、食堂、火车厢:三幅漫画吃透栈、队列与链表
javascript·算法
谷子在生长29 分钟前
纯血鸿蒙自定义弹窗最佳实践:从「到处复制」到「一行调用」
前端·harmonyos
壹方秘境31 分钟前
我用Go语言开发了一个跨平台的HTTPS抓包和调试工具
前端·后端·ios
神秘面具男32 分钟前
HarmonyOS 6.0跨端远程控制
前端·后端
枫树下x32 分钟前
NestJS基础框架
前端
胡志辉33 分钟前
从v8源码和react深入浅出理解 JavaScript 作用域链与闭包
前端·javascript
天蓝色的鱼鱼1 小时前
React Router v8 来了:react-router-dom 没了,老项目该怎么迁移?
前端·react.js
Bolt1 小时前
TypeScript 7.0 来了:当 tsc 用 Go 重写之后
javascript·typescript·go
闪闪发光得欧2 小时前
前端提效新思路:Gemini 3.5 自动化定位 CSS 异常
前端·css