区别:

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. 转 SecureCRT中文乱码解决方法

    1. 打开对话窗口,在工具栏中点开“选项”,选择“会话选项”.  2. 在打开的“会话选项”中,选择“外观”.  3. 在显示的“窗口和文本外观”中找到“字符编码”.  4. 把“字符编码”设置为“U ...

  2. 546 Remove Boxes 移除盒子

    给定一些不同颜色的盒子,以不同的正整数表示.消去连续相同颜色的盒子,直到全部消除完毕为止.每一次消去可以得到k * k分(k为消去盒子的个数, k  >= 1).计算可以得到的最大得分.注意:盒 ...

  3. 105 Construct Binary Tree from Preorder and Inorder Traversal 从前序与中序遍历序列构造二叉树

    给定一棵树的前序遍历与中序遍历,依据此构造二叉树.注意:你可以假设树中没有重复的元素.例如,给出前序遍历 = [3,9,20,15,7]中序遍历 = [9,3,15,20,7]返回如下的二叉树:    ...

  4. 一次Socket通信联想到的Zookeeper源码实现

    最近做一个短信平台,要接入短信网关平台,网关平台使用C,短信平台属于公司内部对外应用,使用Java开发,两边通信采用TCP/IP协议

  5. Java-IDEA环境搭建swagger

    1.项目POM导入包(使用Maven管理的代码) 2.POM文件导入包 <dependencyManagement> <dependencies> <dependency ...

  6. Java语言中自动生成随机数

    参考原文:http://zhidao.baidu.com/link?url=nB3BT69wmUAiSPfKGgK5Q7HOFFP9AIE04AthreRd9yYcwKhUQsQRWlMdMhW1Qm ...

  7. SAP不同的产品是如何支持用户创建自定义字段的

    我们从SAP CRM,Cloud for Customer(简称C4C)和S/4HANA这三个产品分别来看看. SAP CRM 我们使用所谓的Application Enhancement Tool( ...

  8. 当互联网遇上家装,十大家装O2O混战

    2015年已过去大半,装修O2O就出现了新的局面:为数众多的家居网络平台在家装O2O领域还未站稳脚跟,新的入局者就打出超低价格登场.新老O2O家装大战迅速展开,除了拼价格还拼品牌和体验,家装O2O的好 ...

  9. Lesson2

    #ifdef __cplusplus #include <cstdlib> #else #include <stdlib.h> #endif #include <SDL/ ...

  10. UVA 427 The Tower of Babylon 巴比伦塔(dp)

    据说是DAG的dp,可用spfa来做,松弛操作改成变长.注意状态的表示. 影响决策的只有顶部的尺寸,因为尺寸可能很大,所以用立方体的编号和高的编号来表示,然后向尺寸更小的转移就行了. #include ...