jQuery的事件处理方法
.on()方法用来处理事件
$("li").on("click",function(){
$(this).addClass("complete")
})
.on()方法处理的最常用的一些事件如下表所示。为了方便开发人员,jquery同样会添加一些额外的事件,比如ready事件,在当前页面准备好之后触发。
用户界面
focus、blur、change
键盘
input、keydown、keyup、keypress
鼠标
click、dbclick、mouseup、mousedown、mouseover、mousemove、mouseout、hover
表单
submit、select、change
文档
ready*、load、unload
浏览器
error、resie、scroll
事件对象
每个事件处理函数都会获得一个时间对象
$("li").on("click",function(e){
eventType = e.type
})
e:将事件对象作为命名参数
e.type:在函数中使用这个名称来指代事件对象,在该对象上使用你所熟悉的点好(成员操作符)来访问其属性和方法
下面表格中的实例使用字母e作为事件对象的缩写。
| 属性 | 说明 |
| type | 事件类型(比如click,mouseover) |
| which | 被按下的按钮或键值 |
| data | 当事件发生时传入该函数的一些额外信息 |
| target | 发生这个事件的DOM元素 |
| pageX | 鼠标相对可视区域左边缘的位置 |
| pageY | 鼠标相对可视区区域上边缘的位置 |
| timeStamp | 事件发生时间距离1970年1月1日的毫秒数,在火狐下无效 |
| 方法 | 说明 |
| .preventDefault | 阻止默认行为 |
| .stopPropagation | 停止冒泡 |
jQuery的事件处理方法的更多相关文章
- jquery.on()超级方法
$.on()方法是jquery1.7之后的一个超级方法,将事件绑定和事件委托整合到一个函数中去,支持绑定多个事件,并且可以绑定自定义事件.使用起来很方便. demo传送门 事件委托 首先说一下事件委托 ...
- jquery之 on()方法
原文地址:http://www.365mini.com/page/jquery-on.htm on()函数用于为指定元素的一个或多个事件绑定事件处理函数. 此外,你还可以额外传递给事件处理函数一些所需 ...
- jquery中Live方法不可用,Jquery中Live方法失效
jquery中Live方法不可用,Jquery中Live方法失效 >>>>>>>>>>>>>>>>> ...
- jQuery事件绑定方法bind、 live、delegate和on的区别
我们试图绑定一些事件到DOM元素上的时候,我相信上面这4个方法是最常用的.而它们之间到底有什么不同呢?在什么场合下用什么方法是最有效的呢? 1.准备知识 当我们在开始的时候,有些知识是必须具备的: 1 ...
- jQuery中on()方法用法实例详解
这篇文章主要介绍了jQuery中on()方法用法,实例分析了on()方法的功能及各种常见的使用技巧,并对比分析了与bind(),live(),delegate()等方法的区别,需要的朋友可以参考下 本 ...
- jQuery系列 第六章 jQuery框架事件处理
第六章 jQuery框架事件处理 JavaScript以事件驱动来实现页面的交互,其核心是以消息为基础,以事件来驱动.虽然利用传统的JavaScript事件处理方式也能够完成页面交互,但jQuery框 ...
- Jquery常用的方法总结
1.关于页面元素的引用通过jquery的$()引用元素包括通过id.class.元素名以及元素的层级关系及dom或者xpath条件等方法,且返回的对象为jquery对象(集合对象),不能直接调用dom ...
- jQuery中on()方法用法实例
这篇文章主要介绍了jQuery中on()方法用法,实例分析了on()方法的功能.定义及在匹配元素上绑定一个或者多个事件处理函数的使用技巧,需要的朋友可以参考下 本文实例讲述了jQuery中on()方法 ...
- jQuery三——筛选方法、事件
一.jquery常用筛选方法 以下为jquery的常用筛选方法: 代码示例如下: <!DOCTYPE html> <html lang="en"> < ...
随机推荐
- Scala极速入门
摘要 当面向对象遇到函数式编程,这就是Scala.简练的语言描述与简单的例子相辅相成,希望能够对大家学习Scala有所帮助. scala 入门 定义 Scala语言是一种面向对象语言,同时又结合了命令 ...
- python whl包的安装
1.首先安装PIP. https://pip.pypa.io/en/latest/installing.html#install-pip python get-pip.py 2.设置好环境变量: C: ...
- string类的常用功能演示
这个程序可用随着我对string的用法的增多而有调整. /* 功能说明: string类的常用功能演示. 实现方式: 主要是演示string的常用函数的用法和它与字符数组的区别与联系 限制条件或者存在 ...
- <Yii 学习>写入日志
$postStr ='test:'.(empty( $GLOBALS["HTTP_RAW_POST_DATA"])?'':$GLOBALS["HTTP_RAW_POST_ ...
- vim直接编辑远程文件
本文由Suzzz原创,发布于http://www.cnblogs.com/Suzzz/p/4116341.html,转载请保留此声明. Linux环境下 vim scp://user@hostIP/P ...
- JavaScript去除字符串两边空格trim
去除字符串左右两端的空格,在大部分编程语言中,比如PHP.vbscript里面可以轻松地使用 trim.ltrim 或 rtrim实现.但在js中却没有这3个内置方法,需要手工编写.下面的实现方法是用 ...
- RPCServiceClient-调用webservice客户端
import javax.xml.namespace.QName; import org.apache.axis2.AxisFault; import org.apache.axis2.address ...
- Jconsole 测试.
Jconsole 测试. 1 下载并安装 d:\Program Files\Java\jdk1.8.0_111\ JDK自带,Windows下图形界面,监控分析Java程序 2 查看jmx进程号 [r ...
- Java8 日期和时间实用技巧
新的日期API ZoneId: 时区ID,用来确定Instant和LocalDateTime互相转换的规则 Instant: 用来表示时间线上的一个点 LocalDate: 表示没有时区的日期, Lo ...
- python的文件锁使用
python的文件锁目前使用的是fcntl这个库,它实际上为 Unix上的ioctl,flock和fcntl 函数提供了一个接口. 1.fcntl库的简单使用 import fcntl import ...