1、

mouseover:会在鼠标进入该元素或者该元素的子元素时触发

mouseenter:只在鼠标进入该元素时触发

mouseout:在鼠标移出该元素或则该元素的子元素时触发

mouseleave:只在鼠标离开该元素时触发

所以在整个过程中,mouseenter mouseleave只触发一次。over和out触发多次(每次进入和退出子元素都会触发)

    var odiv = document.getElementById('outer');
odiv.addEventListener('mouseenter',enterHandler,false);
odiv.addEventListener('mouseover',overHandler,false);
odiv.addEventListener('mouseout',outHandler,false);
odiv.addEventListener('mouseleave',leaveHandler,false); function enterHandler(){
console.log('触发enter事件');
}
function overHandler(){
console.log('触发over事件');
}
function outHandler(){
console.log('触发out事件');
}
function leaveHandler(){
console.log('触发leave事件');
}

mouseover事件mouseenter事件的更多相关文章

  1. jQuery里的mouseover与mouseenter事件类型区别

    JQ里面有mouseover和mouseenter  2个事件类型干着差不多的活,用不好经常出现些小问题. 今天我解释一下原理: 事件类型翻译: mouseover 鼠标移上 mouseenter 鼠 ...

  2. setTimeout用于取消多次执行mouseover或者mouseenter事件,间接实现hover的悬停加载的效果.

    Mouseenter在鼠标滑上去不会对其子元素也发生监听, Mouseover在鼠标滑上去会对其子元素发生监听. 所以对于事件的监听,我们要看需求,这里是对父元素的监听,不需要对子元素做监听.就用mo ...

  3. mouseover事件与mouseenter事件的区别

    不论鼠标指针穿过被选元素或其子元素,都会触发 mouseover 事件.对应mouseout 只有在鼠标指针穿过被选元素时,才会触发 mouseenter 事件.对应mouseleave 被触发的 M ...

  4. 关于事件mouseover ,mouseout ,mouseenter,mouseleave的区别

    轮播中大多会选择mouseover和mouseout  这个时候是没有任何问题的 但当遇到有css3动画的时候,会发现移入移出过快 动画还没加载完成就需要执行下一个动画,完了动画样式就错乱了. 这时候 ...

  5. 做二级菜单时候遇到的关于事件冒泡以及mouseover和mouseenter的不同

    二级菜单作为最普通小组件,我遇到了坑. <style> .wrapper { height: 150px; border: 1px solid; width: 150px; } .wrap ...

  6. 一个例子说明mouseover事件与mouseenter事件的区别

    <html> <head> <meta charset="UTF-8"> <title>haha</title> < ...

  7. mouseover和mouseenter两个事件的区别

    mouseover(鼠标覆盖) mouseenter(鼠标进入) 二者的本质区别在于,mouseenter不会冒泡,简单的说,它不会被它本身的子元素的状态影响到.但是mouseover就会被它的子元素 ...

  8. 事件处理& 事件委托& 区别mouseover与mouseenter

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  9. 第二十七课:滚轮事件,mouseenter与mouseleave事件的修复

    滚轮事件 jQuery核心库没有对mousewheel事件的差异性进行处理,但作为一个常用的事件,本文讲解一下. mousewheel事件只有火狐浏览器不支持.mousewheel用于取得滚动距离的属 ...

随机推荐

  1. Linux入门之常用命令(11) 系统监控 vmstat top

    vmstat命令是最常见的Linux/Unix监控工具,可以展现给定时间间隔的服务器的状态值,包括服务器的CPU使用率,内存使用,虚拟内存交换情况,IO读写情况.这个命令是我查看Linux/Unix最 ...

  2. centos 6.5系统下安装ibus及设置开机自启动

    先说一下系统环境:centos 6.5,然后我是以root身份执行的,没有权限的用户参见sudo用法 第1步:查找并安装ibus安装包,命令如下: 找到一行: ibus-pinyin.x86_64 : ...

  3. B树、B+树、B*树

    二叉搜索树 即二叉搜索树: 1.所有非叶子结点至多拥有两个儿子(Left和Right): 2.所有结点存储一个关键字: 3.非叶子结点的左指针指向小于其关键字的子树,右指针指向大于其关键字的子树: 如 ...

  4. Win下安装虚拟机(Linux)

    **********************win下体验linux**************************************By熟知宇某 一.先说说win10和win8系统下的hyp ...

  5. 【DP】捡苹果

    #include<stdio.h> int max(int a,int b) { int c; if(a>b) c=a; else c=b; return c; } int main ...

  6. Crossin 8-3;8-4

    8-3文件打开模式:r:只读模式.默认w:只写模式.会先清空文件a:追加写入模式,在文件末尾写入,不可读r+:打开一个文件用于读写.文件指针将会放在文件的开头,原文件内容不会清空b:二进制模式,与前面 ...

  7. postman - 基本操作

    设置环境 collections 导入 runner 导入 api 配置api 编写测试(请求和响应)脚本 api的保存和导出 setting file -- setting

  8. Tarjan LCA

    强连通 迷宫城堡 Proving Equivalences Equivalent Sets Summer Holiday Intelligence System The King's Problem ...

  9. 浅谈Java多态

    什么是Java中的多态?又是一个纸老虎的概念,老套路,把它具体化,细分化,先想三个问题(注意,这里不是简单的化整为零,而是要建立在学习一个新概念时的思考框架): 1.这个东西有什么用?用来干什么的?它 ...

  10. MySQL自定义函数用法详解-复合结构自定义变量/流程控制

    自定义函数 (user-defined function UDF)就是用一个象ABS() 或 CONCAT()这样的固有(内建)函数一样作用的新函数去扩展MySQL. 所以UDF是对MySQL功能的一 ...