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('离开页面')
  }
})
相关推荐
用户21366100357212 小时前
Redux异步方案与React性能优化Hooks
前端
假如让我当三天老蒯12 小时前
TypeScript 继续学习(学习用)
前端·面试·typescript
玄玄子12 小时前
CSS 浮动引起父元素高度塌陷
前端·css
拾年27512 小时前
我用 30 行代码,搞懂了大模型是怎么"读"中文的
javascript·人工智能·llm
竹林81812 小时前
从 ethers.js 到 viem:我在一个 DeFi 看板项目中踩过的所有坑与最终方案
前端·javascript
kyrie2812 小时前
React Redux 完整用法
前端
bonechips12 小时前
Tool Use:从"缸中大脑"到 AI Agent 的技术真相
javascript·agent
程序员鱼皮12 小时前
Codex 又出王炸功能「录制回放」,实战测评!附原理浅析
前端·后端·ai编程
lichenyang45312 小时前
AbilityMeta 能力元信息:不只是能调用,还要能看懂
前端
渣波13 小时前
拒绝黑盒!NestJS + LangChain 实战保姆级拆解,手把手教你搞定双 Token 与 AI 大脑
前端·后端