文档章节

jQuery事件之鼠标事件

h
 heiyexue
发布于 2014/06/23 13:03
字数 485
阅读 62
收藏 8
鼠标事件是在用户移动鼠标光标或者使用任意鼠标键点击时触发的。
   (1):click事件:click事件于用户在元素敲击鼠标左键,并在相同元素上松开左键时触发。
        $('p').click(function(){
                alert('click function is running !');
              });
    (2):dbclick事件:dbclick事件在用户完成迅速连续的两次点击之后触发,双击的速度取决于操作系统的设置。一般双击事件在页面中不经常使用。
        $('p').dbclick(function(){
                alert('dbclick function is running !');
              });
    (3):mousedown事件:mousedown事件在用户敲击鼠标键时触发,跟keydown事件不一样,该事件仅在按下鼠标时触发。
        $('p').mousedown(function(){
                alert('mousedown function is running !');
              });
    (4):mouseup事件:mouseup事件在用户松开鼠标时触发,如果在与按下鼠标的元素相同元素上松开,那么click事件也会触发。
        $('p').mouseup(function(){
                alert('mouseup function is running !');
              }).click(function(){
                 alert('click function is running too !');
                 });
    (5):mouseover事件:mouseover事件于用户把鼠标从一个元素移动到另外一个元素上时触发,如果需要知道来自那个元素可以使用,relatedTagrget属性。
    (6):mouseout事件:mouseout事件于用户把鼠标移出一个元素时触发,这包括从父元素移动到子元素上,或者使用键盘跳到元素上。
    (5)和(6)这两个事件一般不常用,很难实现与用户的交互,也就是说不易捕获用户事件。
    (7):mouseenter事件:mouseenter事件是在用户光标进入元素上时触发。
         $('p').mouseenter(function(){
                alert('mouseenter function is running !');
              });
    (8):mouseleaver事件:mouseleaver事件是在用户的光标离开元素时触发。
           $('p').mouseleaver(function(){
                alert('mouseleaver function is running !');
             });
      (7)和(8)这两个事件一般连起来使用,在jQuery中可以使用hover这个函数来代替这两个函数。
       $('p').hover(function(){
                       alert('mouseenter function is running !');
                      },function(){
                              alert('mouseleaver function is running !');
                         });

© 著作权归作者所有

共有 人打赏支持
h
粉丝 2
博文 85
码字总数 78924
作品 0
哈尔滨
私信 提问
hover 和 mosueover,mouseout 真的不一样

以下是我的测试代码,需要用到jquery,主要是在火狐下发现了这一个问题 知识: W3C在mouseover和mouseout事件中添加了relatedTarget属性。在mouseover事件中,它表示鼠标来自哪个元素,在mou...

subying
2013/03/25
0
1
第78天:jQuery事件总结(一)

jQuery事件总结(一)   现在就一点一点积累自己的知识体系,记录自己学到的和自己所理解的jQuery。   JavaScript和HTML之间的交互式通过用户和浏览器操作页面时引发的事件机制来处理的。...

半指温柔乐
2017/11/08
0
0
jquery 事件对象属性小结

使用事件自然少不了事件对象. 因为不同浏览器之间事件对象的获取, 以及事件对象的属性都有差异, 导致我们很难跨浏览器使用事件对象. jQuery中统一了事件对象, 当绑定事件处理函数时, 会将jQu...

i33
2012/10/25
0
0
《基于JQuery和CSS的特效整理》系列分享专栏

《基于JQuery和CSS的特效整理》已整理成PDF文档,点击可直接下载至本地查阅 https://www.webfalse.com/read/201724.html 文章 一款基于jQuery的颜色拾取器 分享一款基于jQuery的QQ表情插件 ...

kaixin_code
2018/11/04
0
0
PEP 0.3.0 发布,Web 统一事件系统

PEP 0.3.0 发布,新增了一些新功能,比如用户可以在 PEP 上面使用指针事件(Pointer Events)、 jQuery UI、jQuery移动、甚至可以切换 Dojo 过程到指针事件过程。 此版本现已提供下载:https...

大胖森
2015/04/22
1K
1

没有更多内容

加载失败,请刷新页面

加载更多

2亿用户背后的Flutter应用框架Fish Redux

背景 在闲鱼深度使用 Flutter 开发过程中,我们遇到了业务代码耦合严重,代码可维护性糟糕,如入泥泞。对于闲鱼这样的负责业务场景,我们需要一个统一的应用框架来摆脱当下的开发困境,而这也...

阿里云官方博客
26分钟前
2
0
C++生成随机数:高斯/正态分布(gaussian/normal distribution)

高斯分布也称为正态分布(normal distribution)。 常用的成熟的生成高斯分布随机数序列的方法由Marsaglia和Bray在1964年提出,C++版本如下: #include <stdlib.h>#include <math.h> d...

天蚕宝衣
30分钟前
1
0
从 Jenkins 迁移到 Jenkins X:一场持续交付之旅

背景 在 dailymotion,我们信奉 DevOps 最佳实践,并且重度使用了 Kubernetes。我们的部分产品(并非全部)已经部署在 Kubernetes 上。在迁移我们的广告技术平台时,为了赶时髦(作者你这么直...

微笑向暖wx
34分钟前
2
0
Kafka Producer Consumer

Producer API org.apache.kafka.clients.producer.KafkaProducer 如果想学习Java工程化、高性能及分布式、深入浅出。微服务、Spring,MyBatis,Netty源码分析的朋友可以加我的Java高级交流:...

编程SHA
41分钟前
1
0
在centos上搭建git服务器并自动同步代码

在centos上搭建git服务器并自动同步代码 tortoisegit git centos linux 5k 次阅读 · 读完需要 15 分钟 0 参考文章 CentOS安装Git实现多人同步开发 centos中GIT服务器搭建及使用密钥连接 简述...

linjin200
43分钟前
1
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部