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"> < ...
随机推荐
- RedHat 6.8 打开vga之后Login界面花屏
/******************************************************************* * RedHat 6.8 打开vga之后Login界面花屏 * ...
- 从零开始的acm竞赛生涯
经过了一段时间的训练,自己的成绩还是很不理想.回首过往,感觉自己还是练得太少,一直没有进入状态,缺乏硬怼出题的能力,思维也不够快,赛场上各种被卡题.可以说,我之前的训练有些仓促,还没有达到入门的水准, ...
- svn Can't revert without reverting children 解决方案
EMZ3.0 qrh$ svn commit -m ""svn: E155010: Commit failed (details follow):svn: E155010: '/U ...
- java代码I/O流类
package com.aini; //流类rr //流操作的步骤: /*1.找到指定File 2.实例化字节流.InputStream/OutputStream/Reader/Writer 3.读/ ...
- mongo shell命令
https://docs.mongodb.com/manual/mongo/ 一.MongoDB客户端使用 1.mongo:启动mongo的客户端,和mongo客户端的登录 [root@cmos1 b ...
- Java-API-Package:org.springframework.beans.factory.annotation
ylbtech-Java-API-Package:org.springframework.beans.factory.annotation 1.返回顶部 1. @NonNullApi @NonNull ...
- DCloud:目录
ylbtech-DCloud:目录 1.返回顶部 1.5+ App开发入门指南 http://ask.dcloud.net.cn/article/89 2. 3. 2.返回顶部 3.返回顶部 ...
- Oracle redo 日志损坏的几种情况下的恢复
Oracle redo 日志损坏的几种情况下的恢复 第一:损坏的redo为非正在使用的redo log 1.归档模式,不是当前正在日志损坏,数据库打开模式. 模拟损坏:SQL> select * ...
- Rails的静态资源管理(三)—— 开发环境的Asset Pipelin
官方文档:http://guides.ruby-china.org/asset_pipeline.html http://guides.rubyonrails.org/asset_pipeline.h ...
- SQL修改日期时间型数据中的年月日
以下语句为更改 tevent表中的eventtime字段为2011-7-16当eventtime为2012-02-29时 update tevent set eventtime='2011-7-16 ...