jq鼠标事件
鼠标事件是在用户移动鼠标光标或者使用任意鼠标键点击时触发的。
(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)mouseleave事件:mouseleave事件是在用户的光标离开元素时触发。
$('p').mouseleave(function(){
alert('mouseleave function is running !');
});
(7)和(8)这两个事件一般连起来使用,在jQuery中可以使用hover这个函数来代替这两个函数。
$('p').hover(function(){
alert('mouseenter function is running !');
},function(){
alert('mouseleaver function is running !');
});
jq鼠标事件的更多相关文章
- jq之鼠标事件
以防自己忘记,最重要的是hover效果的 鼠标事件是在用户移动鼠标光标或者使用任意鼠标键点击时触发的. (1):click事件:click事件于用户在元素敲击鼠标左键,并在相同元素上松开左键时触发 ...
- day53 鼠标事件 键盘事件 及JQuery
复习 // 语法: ECMAScript 操作: DOM BOM // 1.类型转化 // 转数字: +"3.14" | parseInt("123abc") ...
- Javascript和jquery事件--鼠标事件的小结
1.鼠标事件的主要事件应该是mouseup, mousedown, mousewheel, mousemove, mouseover, moveout. <1>其中mouseup和mous ...
- JQ绑定事件的叠加和解决,index()方法的坑
JQ绑定事件的叠加和解决,index()方法的坑 前言 在做过几个不大不小的项目后,发现技术这种东西,必须要多多实践,才能发现各种问题,理论的知识掌握的再好终究是纸上谈兵. 因此目前感觉有两点是必须要 ...
- 7.JAVA之GUI编程鼠标事件
鼠标事件: 功能: 1.基本窗体功能实现 2.鼠标移动监听,当鼠标移动到按钮上时,触发打印事件. 3.按钮活动监听,当按钮活动时,触发打印事件. 4.按钮被单击时触发打印事件. 源码如下: impor ...
- 手持设备点击响应速度,鼠标事件与touch事件的那些事
前言 现在一直在做移动端的开发,这次将单页应用的网页内嵌入了app,于是老大反映了一个问题:app应用点击响应慢!我开始不以为然,于是拿着网页版的试了试,好像确实有一定延迟,于是开始了研究,最后选择了 ...
- css屏蔽元素的鼠标事件pointer-events
// 屏蔽点击 $('body').css('pointer-events', 'none'); //恢复默认 $('body').css('pointer-events', 'auto'); 用 ...
- 深入学习jQuery鼠标事件
× 目录 [1]类型 [2]写法 [3]合成事件[4]鼠标按键[5]修改键[6]坐标位置 前面的话 鼠标事件是DOM事件中最常用的事件,jQuery对鼠标事件进行了封装和扩展.本文将详细介绍jQuer ...
- 深入理解DOM事件类型系列第一篇——鼠标事件
× 目录 [1]类型 [2]顺序 [3]坐标位置[4]修改键[5]相关元素[6]鼠标按键[7]滚轮事件[8]移动设备 前面的话 鼠标事件是web开发中最常用的一类事件,毕竟鼠标是最主要的定位设备.本文 ...
随机推荐
- vue中路由跳转的底层原理
前端路由是直接找到与地址匹配的一个组件或对象并将其渲染出来.改变浏览器地址而不向服务器发出请求有两种方式: 1. 在地址中加入#以欺骗浏览器,地址的改变是由于正在进行页内导航 2. 使用H5的wind ...
- Qt重绘之update,repaint详解
Qt里面的重绘和Windows编程里面的重绘差不多.但是Qt的重绘更有特色,更加智能. 在讲之前,先说说paintEvent() paintEvent()是一个虚函数槽(slot),子类可以对父类的p ...
- GP数据库 常用SQL语句
GP数据库 常用SQL语句 --1,查看列名以及类型 select upper(column_name) ,data_type from information_schema.columns wher ...
- id、class等各种选择器总结
1. id 选择器 # class 选择器 . 标签 选择器 标签名 群组 ...
- C++读写图片数据转成Base64格式
转载:http://www.cnblogs.com/jeray/p/8746976.html 转载:https://www.cnblogs.com/lujin49/p/4957742.html 转载: ...
- 论文笔记:DARTS: Differentiable Architecture Search
DARTS: Differentiable Architecture Search 2019-03-19 10:04:26accepted by ICLR 2019 Paper:https://arx ...
- BUTXO详解
在比原链中,每个交易消耗之前交易生成的BUTXO 然后生成新的 BUTXO,账户的余额即所有属于该地址的未花费 BUTXO 集合,BTM 的全局状态即当前所有未花费的BUTXO 集合.我们用一个具体的 ...
- 如何解决 React 官方脚手架不支持 Less 的问题
说在前面 create-react-app 是由 React 官方提供并推荐使用构建新的 React 单页面应用程序的最佳方式,不过目前版本(1.5.x)其构建的项目中默认是不支持动态样式语言 Les ...
- idea工具和激活码获取
1.下载最新的idea https://blog.csdn.net/mashuai720/article/details/79389314 2.获取激活码 最后一个有效,亲测 https://blog ...
- 2、Docker基础用法
容器镜像:https://hub.docker.com/ Docker架构图: https://ruby-china.org/topics/22004 Docker使用客户端-服务器(client- ...