<html>

<head>

    <meta charset="UTF-8">

    <script src="jquery-3.3.1.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>

</head>

<body>

<p>不论鼠标指针穿过被选元素或其子元素，都会触发 mouseover 事件。</p>

<p>只有在鼠标指针穿过被选元素时，才会触发 mouseenter 事件。</p>

<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>

</body>

</html>

3.mouseenter和mouseover事件的区别的更多相关文章

  1. mouseover和mouseenter两个事件的区别

    mouseover(鼠标覆盖) mouseenter(鼠标进入) 二者的本质区别在于,mouseenter不会冒泡,简单的说,它不会被它本身的子元素的状态影响到.但是mouseover就会被它的子元素 ...

  2. 事件处理& 事件委托& 区别mouseover与mouseenter

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  3. jQuery里的mouseover与mouseenter事件类型区别

    JQ里面有mouseover和mouseenter  2个事件类型干着差不多的活,用不好经常出现些小问题. 今天我解释一下原理: 事件类型翻译: mouseover 鼠标移上 mouseenter 鼠 ...

  4. mouseover事件与mouseenter事件的区别

    不论鼠标指针穿过被选元素或其子元素,都会触发 mouseover 事件.对应mouseout 只有在鼠标指针穿过被选元素时,才会触发 mouseenter 事件.对应mouseleave 被触发的 M ...

  5. 一个例子说明mouseover事件与mouseenter事件的区别

    <html> <head> <meta charset="UTF-8"> <title>haha</title> < ...

  6. 最终解决 mouseenter, mouseleave , mouseout mousehover mousemove等事件的区别?

    在jquery中, html页面的div的显示和隐藏, 修改等的功能, 最终都要由 事件 触发来引用, 不管是键盘事件, 还是鼠标事件... mouseenter和mouseleave是成对对应的, ...

  7. jQuery mouseover与mouseenter,mouseout与mouseleave的区别

    mouseover与mouseenter 不论鼠标指针穿过被选元素或其子元素,都会触发 mouseover 事件. 只有在鼠标指针穿过被选元素时,才会触发 mouseenter 事件. mouseou ...

  8. mouseenter和mouseover的区别

    mouseover事件-不论鼠标指针穿过被选元素或其子元素,都会触发. mouseenter事件-只有在鼠标指针穿过被选元素时才会触发,对应事件为mouseleave. mouseout事件-不论鼠标 ...

  9. mouseover与mouseenter,mouseout与mouseleave的区别

    mouseover与mouseenter 不论鼠标指针穿过被选元素或其子元素,都会触发 mouseover 事件.只有在鼠标指针穿过被选元素时,才会触发 mouseenter 事件. mouseout ...

随机推荐

  1. wordpress 学习笔记

    (1) __()函数 function __( $text, $domain = 'default' ) { return translate( $text, $domain ); } 返回一个字符串 ...

  2. 关于PHP的一个坑爹问题（页面刷新）

    最近在用PHP做一个服务端和一个客户端,在快要完工的时候,出现了一个重大问题---- 当在客户端手动输入IP和端口的时候,一按连接,OK,连接成功,嘻嘻,就在我自以为大功告成的时候,来了个晴天霹雳,一 ...

  3. 重置CentOS6.5的登录口令

    早先在虚拟机Vmware里安装了一台CentOS6.5,现在想登录,发现无论怎么输入登录口令都不正确,以至于无法登录. 查阅网上资料,可用下面步骤里的方法重置登录口令,在此记录. 1.启动机器,出现下 ...

  4. C++ 重载操作符- 01 简单的入门

    重载操作符的定义 这篇博客是对 重载操作符 的一个概要性的介绍. 重载操作符是C++语言的高级功能,当我们写一个类的时候,可以根据需要学一个重载操作符,如果 不需要,我们可以不写. 大量的操作符都可以 ...

  5. unity5.6里Baked Lighting下面几个Lighting Mode的解释

    这个似乎是新增的功能,目前在官方文档里还没有解释,但有一个链接指向『草案』, 可是链接在被墙的google doc上,为了方便阅读和备忘,全部贴过来整在一起: 因为原文太长,把总结写在前面吧: 1.四 ...

  6. 打印单据，A4纸，每个单据占一个A4纸，两个单据之间不挨着

    打印单据,A4纸,每个单据占一个A4纸,两个单据之间不挨着 <style type="text/css" media="print">.Noprin ...

  7. 浏览器访问www.meituan.com过程

    “从浏览器输入 xxx 到跳转完成的过程发生了什么”,是一个常见的比较综合的面试题,以下是我查阅了一些资料后总结的,如有错误,还望批评指正.(以美团网为例) 1.在浏览器地址栏输入:meituan.c ...

  8. js打开所在文件夹并选中文件

    该方法只支持IE. var wsh = new ActiveXObject("WSCript.shell");  var src = "/select," + ...

  9. 命令之 ulimit

    help ulimit help ulimit ulimit: ulimit [-SHacdefilmnpqrstuvx] [limit] Modify shell resource limits. ...

  10. Java SimpleDateFormat工具类

    package AnimalDemo; import java.text.ParseException; import java.text.SimpleDateFormat; import java. ...