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('离开页面')
  }
})
相关推荐
乘风gg2 分钟前
前端死到第几轮了?得物前端部门解散有感!
前端·ai编程·claude
艾伦野鸽ggg6 分钟前
web 组大一下第二次考核
前端·css·html
geovindu6 分钟前
python: Reactor Pattern
开发语言·python·设计模式·反应器模式
水煮白菜王12 分钟前
高德地图"未获得商用授权"水印临时移除方案
前端·javascript
CS_SKILL12 分钟前
吉比特 C++ 实习一面面经:一轮把 C++、容器、并发、排序和网络全扫了一遍
java·开发语言·校招面经·实习面经·技术面经·吉比特校招
库拉AI小李13 分钟前
# 数据清洗与分析:Gemini 3.5 处理 Excel 数据的实操体验
前端·人工智能·后端
feifeigo12313 分钟前
基于多混沌映射的图像加密(MATLAB实现)
开发语言·matlab
小小小小宇13 分钟前
React17 18 19 新增能力、解决问题、原理与使用详解
前端
chushiyunen14 分钟前
vue el-pagination实现分页
javascript·vue.js·elementui
by————组态15 分钟前
Ricon组态可视化编辑器 - 所见即所得的工业画布
前端·javascript·物联网·架构·编辑器·组态