jQuery关于mouseover和mouseenter的区别
原生的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的区别的更多相关文章
- jquery中mouseover和mouseenter的区别
jquery中mouseover和mouseenter的区别 一.总结 一句话总结: 见名知意:enter(进入)和over(在上方)的意思好好思考一下 mouseover就是从子元素回到自己的时候也 ...
- mouseover和mouseenter的区别
mouseover和mouseenter都是鼠标事件. mouseover事件,当鼠标穿过被选元素的时候,若此元素有子元素,子元素也会被触发此事件.即是使用mouseover事件,会多次触发此元素. ...
- jQuery mouseover与mouseenter的区别
在我们的页面中经常会用到mouseover与mouseout事件来给页面添加更好的渲染效果,但如果触发mouseover事件的元素有子元素的话,会造成闪烁的效果,看着很不舒服,这是因为mouseove ...
- JQuery中的mouseover和mouseenter的区别
mouseover和mouseout是一对:mouseenter和mouseleave是一对. 相同点:都是鼠标经过就触发事件 不同点: 给外盒子一个经过触发事件,但是mouseover会在鼠标经过外 ...
- JQ中mouseover和mouseenter的区别
我最近也在学习JQuery,所以最近对JQ中的一些小问题进行总结,方便学习. 在对于刚开始学习JQ的初学者来说,mouseover事件和mouseenter事件总是傻傻分不清楚,毕竟刚开始学习的时候, ...
- mouseover与mouseenter的区别
mouseenter事件在鼠标进入某个元素,或第一次进入这个元素的某个子元素时触发.一旦触发后,在mouseleave之前,鼠标在这个元素的子元素上触发mouseenter事件都不会触发这个元素的mo ...
- 【转】mouseover和mouseenter的区别
一.当绑定着两个事件的元素里面没有子元素的时候,这两个事件的触发效果是一致的: x=0; y=0; $(document).ready(function(){ $("div.over&quo ...
- The different of mouseover and mouseenter
l论事件onmouseover 和 onmouseenter:同类比较onmouseout 和 onmouseleave; 使用onmouseover时,鼠标除了被设置事件的元素,还会触发其子元素: ...
- jquery的hover mouseover mouseout mouseenter mouseleave的区别
jquery的hover mouseover mouseout mouseenter mouseleave的区别 1.mouseover mouseout mouseover - 鼠标指针经过任何子元 ...
随机推荐
- STL中的set集合容器进行集合运算:并、交、差实例
集合容器的集合运算:并.交.差: #include "stdafx.h" #include <iostream> #include <set> #inclu ...
- 关于iconfont
1. 从FONT-FACE说起 要想了解iconfont,得从一个新的css3规则说起.css3中,新增了一种样式规则,@font-face,这个规则可以用来引入自定义的字体,到客户端.以前,我们的字 ...
- office 文件在网页中显示
1.如何在网页上显示word和excel a.可以使用office组件或aspose将word 和excel 转换为pdf 然后在网页上打开pdf,但是效果不是很好 .比如说excel 多个工作薄不是 ...
- android——ObjectAnimator动画(一)
直接贴上集中用法 package com.example.test; import com.example.test.views.CircleView; import android.animatio ...
- nth-child和nth-of-type的区别
以前一般都用:nth-child,后来知道了:nth-of-type,然后就一般用nth-of-type 它们两有什么区别呢? 首先来看个现象: 假如有这样一个HTML结构 <div class ...
- javascript模式——Flyweight
Flyweight是一种共享数据内存的模式. Flyweight模式是将一些公有属性从个人中剔除,放在共享的对象当中. 下面以一个项目实例,通过不断的改进,以显示Flyweight模式的优点. 现在我 ...
- git 常用命令总结。
引用:http://www.liaoxuefeng.com/wiki/0013739516305929606dd18361248578c67b8067c8c017b000/00137396284551 ...
- arm mov 指令
语法格式: mov {条件} 1目的寄存器,2源操作数 作用: MOV指令可完成从另一个寄存器.被移位的寄存器或立即数赋值到目的寄存器.其中S选项为指令的操作结果是否操作CPSR中的条件标志位,当没有 ...
- 运行加速多线程和GPU
http://blog.csdn.net/augusdi/article/details/11883003
- sqlite数据库常用语句
这个文件型数据库小巧好用,可以替代ACCESS,以下是常用的语句 获取数据库时间(设计表字段时的当前时间默认值) sqlite datetime('now', 'localtime') ...