区别:

mouseover与mouseenter

  不论鼠标指针穿过被选元素或其子元素,都会触发 mouseover 事件。

  只有在鼠标指针穿过被选元素时,才会触发 mouseenter 事件。

mouseout与mouseleave

  不论鼠标指针离开被选元素还是任何子元素,都会触发 mouseout 事件。

  只有在鼠标指针离开被选元素时,才会触发 mouseleave 事件。

在#a没有子元素的情况下,两者在效果上没有区别

但是#a有子元素的情况下,为了mouseovermouseout触发的此时就可能比mouseenter,mouseleave多

$("#a").mouseover(function(){ $(this).children().slideDown(1000); }).mouseout(function(){ $(this).children().slideUpt(1000); });

$("#a").mouseenter(function(){ $(this).children().slideDown(1000); }).mouseleave(function(){ $(this).children().slideUp(1000); });

而slideUp是个过程需要时间,但是mouseout,mouseover,mouseenter,mouseleave事件都是瞬间发生,多次触发会产生动画重复,这个可以用jq的stop方法阻止动画。

$("#a").mouseenter(function(){ $(this).children().stop().slideDown(1000); }).mouseleave(function(){ $(this).children().stop().slideUp(1000); });

jquery stop:

//语法结构

$("#div").stop();//停止当前动画,继续下一个动画
$("#div").stop(true);//清除元素的所有动画
$("#div").stop(false, true);//让当前动画直接到达末状态 ,继续下一个动画
$("#div").stop(true, true);//清除元素的所有动画,让当前动画直接到达末状态

jq:mouseover和mouseout多次触发解决办法的更多相关文章

  1. mouseover和mouseout多次触发解决方法(兼容ie和firefox)(转)

    在用到mouseover和mouseout事件来作为事件触发的条件,但是如果我们用做触发的元素内部有其他的元素的时候当鼠标移上的时候会反复的触发mouseover和mouseout事件,如导致菜单闪烁 ...

  2. js当中mouseover和mouseout多次触发(非冒泡)

    JS当中,mouseover和mouseout多次触发事件,不光是冒泡会产生,就是不冒泡,在一定条件下 ,也会产生多次触发事件: 例如下面的结构的情况下,我在class="ceng_up f ...

  3. Vue事件总线(eventBus)$on()会多次触发解决办法

    项目中使用了事件总线eventBus来进行两个组件间的通信, 使用方法是是建立eventBus.js文件,暴露一个空的Vue实例,如下: import Vue from 'vue'export def ...

  4. mouseover和mouseout事件在鼠标经过子元素时也会触发

    JavaScript的mouseover和mouseout事件,在绑定元素内部有子元素的情况下, 经过绑定元素时会多次触发mouseover和mouseout事件. jQuery解决办法: jquer ...

  5. vue -vantUI tab切换时 list组件不触发load事件解决办法

    最近由于公司项目需要,用vue写了几个简单的页面.用到了vantUI List 列表 瀑布流滚动加载,用于控制长列表的展示 当列表即将滚动到底部时,会触发事件并加载更多列表项. (页面加载完成后默认会 ...

  6. 前端的事件冒泡(例如点击一次onclick事件执行两次)解决办法

    问题概要: 当我运用antd 中 radio组件的时候发现radio组件是有bug的 就是你不能给他赋予id 和 value,同时也绑定不上onclick等事件.举个例子: 可以看到 你就算赋予了id ...

  7. 鼠标 mouseover和mouseout事件

    在div内想实现鼠标移入移出效果,最开始的时候是用了jquery的mouseout和mouseover事件来实现的, $('.product).mouseover(function(){ …… }). ...

  8. mouseover和mouseout闪烁问题

    在父级元素上注册了mouseover和mouseout事件后,当鼠标移动到子元素上时,会触发父级的mouseout和mouseover事件,反复触发,形成闪烁. 原因: 一种是由于冒泡,子级的mous ...

  9. jQuery中mouseover和mouseout冒泡产生闪烁问题

    问题:在jQuery中,对元素绑定mouseover和mouseout事件时,每次移入移出该元素和子元素时,都会触发事件,从而会出现闪动的现象. 原因:浏览器的冒泡行为. 解决方案: 使用mousee ...

随机推荐

  1. OS 内存泄漏 导致 整个aix主机block

    问题 aix 主机 1.数据库主机使用vmstat 监控,隔几分钟 就是block 爆满. cpu 没有瓶颈,I/O 显示本地磁盘hdisk0和hdisk 1 是爆满. vmstat 同时显示大量pa ...

  2. odoo filter 日期

    <!--日期--> <filter name="before_twodays" string="前天" domain="[('dat ...

  3. AQS及其前置知识总结

    CLH队列锁 及自旋锁 乐观锁及CAS 独占锁与共享锁 LockSupport与wait ,join和notify 这里截取内部类Node的部分代码,节点的状态值如下: /** waitStatus ...

  4. 基于Matlab的标记分水岭分割算法

    转自:http://blog.sina.com.cn/lyqmath 1 综述 Separating touching objects in an image is one of the more d ...

  5. drupal6提示 Compilation failed: disallowed Unicode code point (>= 0xd800 && <= 0xdfff) at offset 9 on line 615

    解决办法:将sites\all\modules\ctools\includes\cleanstring.inc文件中的61行改成62行这样子即可,如下图

  6. CF1081E Missing Numbers

    思路: 贪心乱搞. 实现: #include <bits/stdc++.h> using namespace std; typedef long long ll; const ll m = ...

  7. 前端常用的jquery代码

    主要是个人在工作中常用到的一些代码,会慢慢添加: 1).enter键时可以触发某些事件,比如登陆事件: $('#loginform').bind('keypress',function(event){ ...

  8. C#操作Txt(追加模式)

    /// <summary> /// 输出指定信息到文本文件 /// </summary> /// <param name="msg">输出信息& ...

  9. 怎样配置JDK开发环境

    (1)我们需要配置三个环境变量,分别是JAVA_HOME,CLASSPATH,Path (2)变量名输入:JAVA_HOME,变量值输入:D:\Java\jdk1.8.0_05点击确定. 需要特别注意 ...

  10. Git强制pull

    git fetch --all git reset --hard origin/master