正文 

当前位置： 首页 > 开发 > java教程

mouseentermouseleave和mouseovermouseout的区别

planetwithpig planetwithpig     2023-03-21     533

关键词：

官方解释

  1. mouseenter // 当鼠标移入元素对象边界内时，激活mouseenter事件。(不会冒泡）
  2. mouseleave // 当鼠标移出元素对象边界内时，激活mouseleave事件。(不会冒泡）

浏览器支持

　　　　技术图片

　　3.  mouseover // 当鼠标移动到元素对象上时，激活mouseover事件。(会冒泡）

　　4.  mouseout // 当鼠标从元素对象上移开，激活mouseout事件。(会冒泡）

区别

  1. mouseenter、mouseover 的区别在于mouseover会有冒泡而mouseenter不会。
  2. 从定义上可以看出，mouseover在其内部有子元素时，当鼠标移动到子元素时（其实此时鼠标从元素对象上移开，移动到了子元素上）触发了mouseout事件，当移动到子元素时，触发了子元素的mouseover事件，由于冒泡的原因，会再次触发父级mouseover事件。 

                                            技术图片

上面的结果是‘mouseover’,‘mouseout’各打印了2次。

步骤1进入外层DIV触发了一次mouseover。步骤2中从外层DIV元素上移开触发了mouseout,当进入子元素DIV时会触发子元素的mouseover,由于会冒泡，所以也触发了外层DIV的mouseover事件。步骤3（只有子元素DIV触发相应的事件时，才会由冒泡的原因触发父级元素的相同事件，所以即使在图上可以看到鼠标已经不在外层DIV的范围内了，仍然不会触发mouseout事件）。步骤4原因同步骤3相同，此时子元素DIV触发了mouseout事件，同样会冒泡到父级DIV上。

                                                    技术图片

上面的结果是‘mouseover’,‘mouseout’各打印了1次。

步骤1进入外层DIV触发了一次mouseenter。步骤2和步骤3都没有移出外层DIV的边界（需要注意的是鼠标在子元素内时仍属于在父级元素内，所以步骤3并没有移出外层DIV的边界）。

步骤4时出发了外层DIV的mouseleave事件。

转自：https://www.cnblogs.com/angleBrackets/p/5130839.html

mouseentermouseleave和mouseovermouseout的区别

官方解释mouseenter // 当鼠标移入元素对象边界内时，激活mouseenter事件。(不会冒泡）mouseleave // 当鼠标移出元素对象边界内时，激活mouseleave事件。(不会冒泡）浏览器支持　　　　　　3. mouseover // 当鼠标... 查看详情

javascript原型自定义事件mouseentermouseleave实现(代码片段)

查看详情

原型自定义事件mouseentermouseleave实现

sincethescriptobservesmouseout,itshouldfiremouseleaveeventsbeforemouseentertopreservecorrectorder.(function(){ functionfirstCommonAncestor(elm1,elm2){ varp=elm1.up(); while(!elm2.descendantOf(p)){ p=p.up(); } returnp; ... 查看详情

VB.Net Mouse.Enter 和 Mouse.Leave 都在同一个事件中调用？

】VB.NetMouse.Enter和Mouse.Leave都在同一个事件中调用？【英文标题】：VB.NetMouse.EnterandMouse.Leavebothcalledinsameevent?【发布时间】：2012-06-1907:47:31【问题描述】：在我的VB.Net表单应用程序中，我有一个函数：PrivateSubpnlMain_MouseLeave(senderAsOb... 查看详情

关于mouse_event和sendinput无效的原因

关于mouse_event和sendinput无效的原因   SetCursorPos有用， 于mouse_event和sendinput无用，导致问题不清晰， 原来是我换了杀毒软件，360搞的。  http://au2008127104.blog.163.com/blog/static/14087113020122747885 查看详情

Cursor.Position 和 Mouse_Event 被阻止

】Cursor.Position和Mouse_Event被阻止【英文标题】：Cursor.PostitionandMouse_EventbeingBlocked【发布时间】：2014-07-1805:07:50【问题描述】：我正在开发一个应用程序，以将一些输入自动化到另一个应用程序中。我遇到了一个问题。下面是我正... 查看详情

python使用笔记：pynput库控制键盘鼠标(代码片段)

...0c;它包含一个子包来控制和监控该种输入设备：pynput.mouse：包含控制和监控鼠标或者触摸板的类。pynput.keyboard：包含控制和监控键盘的类。基本用法介绍：frompynput.mouseimportButton,Controllerimporttime#获取当前鼠标位置mo... 查看详情

MOUSE_OUT 在影片剪辑之外？

】MOUSE_OUT在影片剪辑之外？【英文标题】：MOUSE_OUToutsideofamovieclip?【发布时间】：2012-04-1805:20:34【问题描述】：我在这里遇到了一个小问题，我是Actionscript3的新手，我想做的是构建一个导航菜单。我所做的是制作了一个影片剪辑... 查看详情

读取 Magic Mouse 和 Apple 无线键盘电池百分比

】读取MagicMouse和Apple无线键盘电池百分比【英文标题】：ReadMagicMouseandAppleWirelessKeyboardBatterypercentage【发布时间】：2010-08-2313:07:53【问题描述】：我想问你是否有人知道在MacOS中访问鼠标和键盘电池状态的简单方法。有一些API可以... 查看详情

2611.老鼠和奶酪(代码片段)

...链接：2611.老鼠和奶酪方法：贪心解题思路题目要求第\\(mouse1\\)恰好吃掉\\(k\\)块奶酪的情况下，计算最大得分。假设\\(mouse1\\)当前吃掉了下标为\\(i\\)处的奶酪，那么应该满足，\\(diff[i]=reward1[i]-reward2[i]\\)是当前所有\\(diff\\)值的... 查看详情

利用stm32cubemx来生成usb_hid_mouse工程添加adc非dma和中断方式

上回讲到怎么采集一路的adc的数据，这次我们来采集两路的数据。现在直接修改原先的代码/*Privatevariables---------------------------------------------------------*/uint16_tAD_Value_Buf[2];uint16_tAD_X_Value=0;uint16_tAD_Y_Value=0;/*USERCODEENDPV 查看详情

WH_MOUSE_LL 钩子，避免得到无用的 WM_MOUSEMOVE 事件

】WH_MOUSE_LL钩子，避免得到无用的WM_MOUSEMOVE事件【英文标题】：WH_MOUSE_LLhook,avoidgettinguselessWM_MOUSEMOVEevents【发布时间】：2012-10-0717:10:42【问题描述】：有没有办法避免在WH_MOUSE_LL钩子中接收WM_MOUSEMOVE事件？我只对***旋转和按钮感兴... 查看详情

electronwindows增加托盘悬浮框功能(代码片段)

...悬浮框（例如做消息提醒），但因为Windows没有提供托盘mouse-enter/mouse-leave事件，无法直接做这个功能，考虑到还有mouse-move事件，弄个间接的方式实现。实现步骤1、监听mouse-move事件，当触发时，即也相当触发mouse-enter事件。2、开... 查看详情

为 WH_MOUSE 设置 WindowsHookEx

】为WH_MOUSE设置WindowsHookEx【英文标题】：SetWindowsHookExforWH_MOUSE【发布时间】：2012-06-2604:52:30【问题描述】：我有一些代码可以在全局范围内打印鼠标的坐标（使用WH_MOUSE_LL）。我的目标是使用WH_MOUSE而不是WH_MOUSE_LL因为（根据我的... 查看详情

vb用mouse_event模拟鼠标双击为啥没有效果?

...单击没有问题，但是双击就没用。代码如下SetCursorPos10,15Mouse_Event6,0,0,0,0Mouse_Event6,0,0,0,0这种没用，只有单击效果，于是加上延时和Doevents试试改成这样SetCursorPos10,15Mouse_Event6,0,0,0,0SleepPlus200'这是一个自己写的延时程序Mouse_Event6,... 查看详情

无法在 Selenium 中使用命令 mouse_down_at

】无法在Selenium中使用命令mouse_down_at【英文标题】：Unabletousethecommandmouse_down_atinSelenium【发布时间】：2013-11-2318:31:50【问题描述】：我正忙于应用程序的UI自动化，在该应用程序中，可以制作与Paint应用程序类似的样式的绘图。在... 查看详情

如何在嵌入式linux开发板上使用usb键盘

...下文阴影部分为注解。一、驱动加载部分staticint__initusb_mouse_init(void)intretval=usb_register(&usb_mouse_driver);//注册鼠标驱动if(retval==0)info(DRIVER_VERSION":"DRIVER_DESC);returnretval;其中usb_mouse_driver的定义为：staticstructusb_driverusb_mouse_driver=.owner=T... 查看详情

actionscript3actionscript3-按钮动作[听多个事件。例如。mouse_over，mouse_out，mouse_up](代码片段)

查看详情