原生的mouseenter是dom3级的事件,对于jQuery等一些框架已经实现了这个事件。但是它到底跟mouseover有什么区别?

jQuery在实现这两个事件的时候,mouseover支持事件冒泡,在父级注册事件,子元素也会触发此事件。而mouseenter只有鼠标划到注册事件的元素才会触发。

看个例子:

<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script type="text/javascript">
x=0;
y=0;
$(document).ready(function(){
$("div.over").mouseover(function(){
$(".over span").text(x+=1);
});
$("div.enter").mouseenter(function(){
$(".enter span").text(y+=1);
});
});
</script>
<div class="over" style="background-color:lightgray;padding:20px;width:40%;float:left">
<h2 style="background-color:white;">被触发的 Mouseover 事件:<span></span></h2>
</div>
<div class="enter" style="background-color:lightgray;padding:20px;width:40%;float:right">
<h2 style="background-color:white;">被触发的 Mouseenter 事件:<span></span></h2>
</div>

  

jQuery关于mouseover和mouseenter的区别的更多相关文章

  1. jquery中mouseover和mouseenter的区别

    jquery中mouseover和mouseenter的区别 一.总结 一句话总结: 见名知意:enter(进入)和over(在上方)的意思好好思考一下 mouseover就是从子元素回到自己的时候也 ...

  2. mouseover和mouseenter的区别

    mouseover和mouseenter都是鼠标事件. mouseover事件,当鼠标穿过被选元素的时候,若此元素有子元素,子元素也会被触发此事件.即是使用mouseover事件,会多次触发此元素. ...

  3. jQuery mouseover与mouseenter的区别

    在我们的页面中经常会用到mouseover与mouseout事件来给页面添加更好的渲染效果,但如果触发mouseover事件的元素有子元素的话,会造成闪烁的效果,看着很不舒服,这是因为mouseove ...

  4. JQuery中的mouseover和mouseenter的区别

    mouseover和mouseout是一对:mouseenter和mouseleave是一对. 相同点:都是鼠标经过就触发事件 不同点: 给外盒子一个经过触发事件,但是mouseover会在鼠标经过外 ...

  5. JQ中mouseover和mouseenter的区别

    我最近也在学习JQuery,所以最近对JQ中的一些小问题进行总结,方便学习. 在对于刚开始学习JQ的初学者来说,mouseover事件和mouseenter事件总是傻傻分不清楚,毕竟刚开始学习的时候, ...

  6. mouseover与mouseenter的区别

    mouseenter事件在鼠标进入某个元素,或第一次进入这个元素的某个子元素时触发.一旦触发后,在mouseleave之前,鼠标在这个元素的子元素上触发mouseenter事件都不会触发这个元素的mo ...

  7. 【转】mouseover和mouseenter的区别

    一.当绑定着两个事件的元素里面没有子元素的时候,这两个事件的触发效果是一致的: x=0; y=0; $(document).ready(function(){ $("div.over&quo ...

  8. The different of mouseover and mouseenter

    l论事件onmouseover 和 onmouseenter:同类比较onmouseout 和 onmouseleave; 使用onmouseover时,鼠标除了被设置事件的元素,还会触发其子元素: ...

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

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

随机推荐

  1. 基于redis AE异步网络架构

    最近的研究已redis源代码,redis高效率是令人钦佩. 在我们的linux那个机器,cpu型号, Intel(R) Pentium(R) CPU G630 @ 2.70GHz  Intel(R) ...

  2. 使用nodeitk进行角点检測

    前言 东莞,晴,33至27度.今天天气真好,学生陆续离开学校.忙完学生答辩事情,最终能够更新一下nodeitk.本文继续介绍node的特征识别相关内容,你会看到,採用nodeitk实现角点检測是一件十 ...

  3. Winform单例模式与传值

    单例模式(singleton)的意思就是只有一个实例.单例模式确保某一个类只有一个实例,而且自行实例化并向整个系统提供这个实例.这个类称为单例类. 在多窗体界面中,如果要加入一个“关于”的窗体,用于显 ...

  4. F, A, MS, QM, RF的OFFER和经历 -- Final update

    昨天收到FB的电话,我的OFFER已经批下来了,这也意味着我的JOB HUNTING结束了,下 面是我这两个月来申请结果汇总: Applications (7): Facebook, Google, ...

  5. USACO OPEN 12 BOOKSELF(转)

    原文出处:http://txhwind.blog.163.com/blog/static/2035241792012112285146817/(版权为原作者所有,本博文无营利目的,不构成侵权) 题目大 ...

  6. Android manifest

    manifest是Android应用程序的配置文,在这里指定了改程序的资源.权限等内容,一般的manifest文件如下 <manifest xmlns:android="http:// ...

  7. Nand flash 的发展和eMMC

    讨论到eMMC的发展历程,必须要从介绍Flash的历史开始 Flash分为两种规格:NOR Flash和NAND Flash,两者均为非易失性闪存模块. 1988年,Intel首次发出NOR flas ...

  8. Android_NFC_开发介绍

    API概览 Android.nfc 和android.nfc.tech 为android 处理nfc的java 包. 1.Android.nfc package包含顶层类用来与本地NFC适配器交互. ...

  9. 【改造Linux命令之rm - 删除文件或目录-】

    用途说明 rm命令是常用的命令,用来删除文件或目录(remove files or directories).它也是一个危险的命令,使用的时候要特别当心,尤其对于新手,否则整个系统就会毁在这个命令(比 ...

  10. 10453 Make Palindrome (dp)

    Problem A Make Palindrome Input: standard input Output: standard output Time Limit: 8 seconds By def ...