又一个傻傻分不清楚的东东~

现实真是一个问题天天有的世界~本以为我对js中的事件还是比较了解的,对于早就接触的mouse事件,更是觉得得心应手了~但是现实却给了我一记重拳!

我自身工作中遇到的犯二的故事就不说了。。。实在太。。。所以就进入主题!

简单的记录一下mouse事件中比较容易搞混的:

mouseover和mouseout他们是一对,而mouseenter和mouseleave是另外一对!

对于大牛们来说,我这么分组应该一目了然了,然而对于新手可能可以往下看看。

mouseover和mouseout被我定义为是一对的原因是:鼠标进出绑定元素和其子元素都会触发事件。

而mouseenter和mouseleave被我定义为是一对的原因是:鼠标进出绑定元素会触发事件,而进出其子元素不会被触发事件。

总结:多读书多看报少吃零食多睡觉

mouseover和mouseout、mouseenter和mouseleave的更多相关文章

  1. mouseover、mouseout,mouseenter、mouseleave区别

    心情压抑的一天,我想好好的. mouseover与mouseenter 不论鼠标指针穿过被选元素或其子元素,都会触发 mouseover 事件. 只有在鼠标指针穿过被选元素时,才会触发 mouseen ...

  2. jquery的hover mouseover mouseout mouseenter mouseleave的区别

    jquery的hover mouseover mouseout mouseenter mouseleave的区别 1.mouseover mouseout mouseover - 鼠标指针经过任何子元 ...

  3. mouseenter(fn)和mouseleave、mouseover和mouseout的的区别

    $('.box1').mouseenter(function(){//穿入事件mouseenter $(this).css('background','red'); }).mouseleave(fun ...

  4. mouseover,mouseout,mouseenter,mouseleave的区别

    1.前言 今天下午参加一个面试,对方问我写不写博客,这时候才猛然意识到好久没写东西了.最近一直在外边实习,每天有很多经历和挑战,但是却没有及时地记录下来,这一点必须得批评自己,以后得经常把自己遇到的问 ...

  5. mouseover,mouseout,mouseenter,mouseleave的区别

    相信做前端开发的都听说过“冒泡型事件”吧,<JavaScript高级程序设计>第九章有详细的讲述,但是,在学习的时候一知半解,也没详细去理解,导致最近在工作中碰到了问题:有许多 li 标签 ...

  6. jquery的鼠标移入移出事件hover、mouseenter、mouseleave、mouseover、mouseout

    hover:鼠标进入元素的子元素时不会触发‘鼠标移开’的事件: mouseenter.mouseleave:效果与hover相同: mouseover: 鼠标进入元素和进入它的子元素时都会触发‘mou ...

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

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

  8. mouseover,mouseout与mouseenter,mouseleave

    针对单个元素,使用感一样. 差异提现在有子元素的情况下: mouseover和mouseout在父元素和其子元素都可以触发,当鼠标穿过一个元素时,触发次数得依子元素数量而言. mouseenter和m ...

  9. Jquery hover方法使用及 mouseenter与mouseleave和 mouseover与mouseout的区别

    定义和用法 hover() 方法规定当鼠标指针悬停在被选元素上时要运行的两个函数. jQuery 1.7 版本前该方法触发 mouseenter 和 mouseleave 事件. jQuery 1.8 ...

随机推荐

  1. 《Matrix Computation 3rd》读书笔记——第4章 特殊线性系统

  2. 改进:js修改iOS微信浏览器的title

    问题简介 前端入门没多久,可能连入门也不算,最近网上流行各自书籍改名,什么<前端开发,从入门到放弃>,<Android开发,从入门到改行>之类的,程序员真是个爱自嘲的群体,但我 ...

  3. linux下vi命令修改文件及保存的使用方法

    进入vi的命令 vi filename :打开或新建文件,并将光标置于第一行首 vi n filename :打开文件,并将光标置于第n行首 vi filename :打开文件,并将光标置于一行首 v ...

  4. 格式化xml

    在程序代码开发过程中,我们可能有时候需要将xml报文进行格式化一下,整理了一下,大概有两种方法: public String formatXml(String inputXml){ SAXReader ...

  5. electron知识点

    1.打开chrome开发工具栏: BrowserWindow.openDevTools();

  6. 承接Hololens游戏外包

    近日,微软宣布第三批微软Hololens开发者版开始发货,包括:头显.头显手提包和一个遥控器.前两批开发者版本分别在今年3月30日和5月9日开始发货的. 第三批AR头显Hololens开发者版发货 虽 ...

  7. [SPI&I2C]I2C和SPI协议介绍

    IIC vs SPI 现今,在低端数字通信应用领域,我们随处可见IIC (Inter-Integrated Circuit) 和 SPI (Serial Peripheral Interface)的身 ...

  8. java Servlet Filter 拦截Ajax请求

    /** * 版权:Copyright 2016-2016 AudaqueTech. Co. Ltd. All Rights Reserved. * 描述: * 创建人:赵巍 * 创建时间:2016年1 ...

  9. Underscore.js基础入门

    公司产品集成了对Underscore.js,所以需要对这个库有一定的了解.通过查阅资料,发现这个库主是对Array和JSON的处理支持.通过Underscore.js库,可以方便的对Array和JSO ...

  10. virtualBox 打开旧的ubuntu虚拟机镜像时找不到网卡的解决方法

    一 环境: ubuntu v8.04 virtualbox _v4.3 二 操作 1 按正常创建新的虚拟机, 然后在选择虚拟硬盘界面选择使用旧的ubuntu虚拟机 2 打开虚拟机 删除/etc/ude ...