<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. ubuntu安装Docky 3.0

    添加PPA并在命令行安装,执行以下命令: sudo add-apt-repository ppa:ricotz/docky sudo apt-get update sudo apt-get insta ...

  2. 接口测试中如何利用cookies保持会话

    使用cookies保持会话自己研究了下应该有两种方式: 1.保持会话的第一种方法:如果用的是同一个HttpClient且没去手动连接放掉client.getConnectionManager().sh ...

  3. python3导入自定义模块

    模块是个好东西啊,大牛们开源共享许多模块也加快了大家开发的速度,许多开源模块可以在这里找到 ↓ https://pypi.python.org/pypi 因为刚入门所有有很多细节不懂,在网上搜寻资料的 ...

  4. MongoDB简介及基础知识

    MongoDB简介 一.MongDB是一个高性能,开源,无模式的文档型NosQL数据库.主要功能特性: 1.文件存储格式BSON(一种json的扩展) 2.模式自由,数据格式不受限了表的结构 3.支持 ...

  5. js中 visibility和display的区别 js中 visibility和display的区别

    大多数人很容易将CSS属性display和visibility混淆,它们看似没有什么不同,其实它们的差别却是很大的. visibility属性用来确定元素是显示还是隐藏,这用visibility=&q ...

  6. Linux 安装(重装)mysql

    1 新建存放mysql相关文件的文件夹 mkdir -p /export/servers/mysql //存放mysql相关的几个rpm文件 2 查看原有mysql 并卸载 rpm -qa | gre ...

  7. 【HDU6026】Deleting Edges

    题意 有一个n个节点的无向图,结点编号从0-n-1,每条边的长度时1to9的一个正整数.现在要删除一些边(或者不删),使得到的新图满足下面两个要求. 1.新图是一颗树有n-1条边2.对于每个结点v(0 ...

  8. 733. Flood Fill 简单型染色问题

    ［抄题］: An image is represented by a 2-D array of integers, each integer representing the pixel value ...

  9. 217. Contains Duplicate数组重复元素 123

    ［抄题］: Given an array of integers, find if the array contains any duplicates. Your function should re ...

  10. Linux PulseAudio

    一.简介 Linux的声音系统或许是最无序的子系统部分!作为Server来说,声音无足轻重,无人问津,而作为桌面来说太多的实现方案,各有各的长出和不足,ALSA经过多年的发展,基本统一了Linux声卡 ...