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

现实真是一个问题天天有的世界~本以为我对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. Linear Algebra lecture4 note

    Inverse of AB,A^(A的转置) Product of elimination matrices  A=LU (no row exchanges)   Inverse of AB,A^(A ...

  2. @SuppressWarnings("deprecation")

    在Java编译过程中会出现很多警告,有很多是安全的,但是每次编译有很多警告影响我们对error的过滤和修改,我们可以在代码中加上 @SuppressWarnings("XXXX") ...

  3. jquery/js实现一个网页同时调用多个倒计时(最新的)

    <div class="time countdown_1" data-time="1449429731"> <span class=" ...

  4. 【P1379】天才的约数和

    来自GDOI2007,原题已不可考-- 又自己做出来了好开心,找特殊性是个关键的切入点 原题: 这天周航遇到了靳泽旭. 周航:"我是天才!" 靳泽旭:"你为什么是天才?& ...

  5. webbrowser 禁用 alert

    void web_Navigated(object sender, WebBrowserNavigatedEventArgs e) { var web = sender as System.Windo ...

  6. ASP.NET MVC图片上传

    工具:ssi-uploader $('#id').ssi_uploader({ url: 'path' }); public ActionResult path() { HttpPostedFileB ...

  7. cAdvisor0.24.1+InfluxDB0.13+Grafana4.0.2搭建Docker1.12.3 Swarm集群性能监控平台

    目录 [TOC] 1.基本概念 ​ 既然是对Docker的容器进行监控,我们就不自己单独搭建cAdvisor.InfluxDB.Grarana了,本文中这三个实例,主要以Docker容器方式运行. 本 ...

  8. python3.5学习笔记--一个简单的图片爬虫

    参考资料:http://v.qq.com/boke/page/q/g/t/q01713cvdgt.html 目的:爬取网站图片 实际上以上链接的视频中已经将整个过程说的非常明白了,稍微有点计算机基础的 ...

  9. 关于QFTP乱码

    // 从FTP接收的内容QString FtpUtil::_FromSpecialEncoding(const QString &InputStr){ #ifdef Q_OS_WIN retu ...

  10. Oauth2.0认证---授权码模式

    目录: 1.功能描述 2.客户端的授权模式 3.授权模式认证流程 4.代码实现 1.功能描述 OAuth在"客户端"与"服务提供商"之间,设置了一个授权层(au ...