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开发中最常用的一类事件,毕竟鼠标是最主要的定位设备.本文 ...
随机推荐
- es7,es8
ES7新特性 ES7在ES6的基础上添加了三项内容:求幂运算符(**).Array.prototype.includes()方法.函数作用域中严格模式的变更. Array.prototype.incl ...
- vxworks开发中simulator的使用之建立虚拟网卡
在使用windriver workben ch开发vxWorks应用时,有时需要在本机上利用Simulator跑一下程序,这就需要你安装一个虚拟的网卡.vxWorks自带了这些工具,下面,以windo ...
- 在java中如何处理日期格式问题
1.最简洁的办法就是在对应的对象中加注解 如下一个例子: @DateTimeFormat(pattern="yyyy-MM-dd") @JsonFormat(pattern=&qu ...
- Pdf Convert Image 的解决方案
brew uninstall ghostscript brew install ghostscript gs -dNOPAUSE -sDEVICE=jpeg -r150 -sOutputFile=./ ...
- IDEA 发布Api
1.修改Main方法 代码: public class AlicsbapiApplication extends SpringBootServletInitializer { @Override pr ...
- Bootstrap常用单词组
布局容器 .container 固定宽度 .container-fluid 全屏 .row 行 .col-lg- 大屏幕 .col-md- 中屏幕 变量 @grid-columns: 12 列数 @g ...
- 关于layui富文本编辑器和form表单提交的问题
今天下午因为要做一个富文本编辑器上传文件给后台,所以看了一下layui的富文本编辑器,折腾了半天,终于把这玩意搞定了. 首先需要先创建layui的富文本编辑器 <textarea id=&quo ...
- react生命周期和组件生命周期
React的组件在第一次挂在的时候首先获取父组件传递的props,接着获取初始的state值,接着经历挂载阶段的三个生命周期函数,也就是ComponentWillMount,render,Compon ...
- SPOJ 1811 LCS - Longest Common Substring
思路 和SPOJ 1812 LCS2 - Longest Common Substring II一个思路,改成两个串就有双倍经验了 代码 #include <cstdio> #includ ...
- 动态生成具有嵌套属性的linq选择(select)
class SelectItem { public string Item { get; set; } } class SelectList { public int ID { get; set; } ...