.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的事件处理方法的更多相关文章

  1. jquery.on()超级方法

    $.on()方法是jquery1.7之后的一个超级方法,将事件绑定和事件委托整合到一个函数中去,支持绑定多个事件,并且可以绑定自定义事件.使用起来很方便. demo传送门 事件委托 首先说一下事件委托 ...

  2. jquery之 on()方法

    原文地址:http://www.365mini.com/page/jquery-on.htm on()函数用于为指定元素的一个或多个事件绑定事件处理函数. 此外,你还可以额外传递给事件处理函数一些所需 ...

  3. jquery中Live方法不可用,Jquery中Live方法失效

    jquery中Live方法不可用,Jquery中Live方法失效 >>>>>>>>>>>>>>>>> ...

  4. jQuery事件绑定方法bind、 live、delegate和on的区别

    我们试图绑定一些事件到DOM元素上的时候,我相信上面这4个方法是最常用的.而它们之间到底有什么不同呢?在什么场合下用什么方法是最有效的呢? 1.准备知识 当我们在开始的时候,有些知识是必须具备的: 1 ...

  5. jQuery中on()方法用法实例详解

    这篇文章主要介绍了jQuery中on()方法用法,实例分析了on()方法的功能及各种常见的使用技巧,并对比分析了与bind(),live(),delegate()等方法的区别,需要的朋友可以参考下 本 ...

  6. jQuery系列 第六章 jQuery框架事件处理

    第六章 jQuery框架事件处理 JavaScript以事件驱动来实现页面的交互,其核心是以消息为基础,以事件来驱动.虽然利用传统的JavaScript事件处理方式也能够完成页面交互,但jQuery框 ...

  7. Jquery常用的方法总结

    1.关于页面元素的引用通过jquery的$()引用元素包括通过id.class.元素名以及元素的层级关系及dom或者xpath条件等方法,且返回的对象为jquery对象(集合对象),不能直接调用dom ...

  8. jQuery中on()方法用法实例

    这篇文章主要介绍了jQuery中on()方法用法,实例分析了on()方法的功能.定义及在匹配元素上绑定一个或者多个事件处理函数的使用技巧,需要的朋友可以参考下 本文实例讲述了jQuery中on()方法 ...

  9. jQuery三——筛选方法、事件

    一.jquery常用筛选方法 以下为jquery的常用筛选方法: 代码示例如下: <!DOCTYPE html> <html lang="en"> < ...

随机推荐

  1. RedHat 6.8 打开vga之后Login界面花屏

    /******************************************************************* * RedHat 6.8 打开vga之后Login界面花屏 * ...

  2. 从零开始的acm竞赛生涯

    经过了一段时间的训练,自己的成绩还是很不理想.回首过往,感觉自己还是练得太少,一直没有进入状态,缺乏硬怼出题的能力,思维也不够快,赛场上各种被卡题.可以说,我之前的训练有些仓促,还没有达到入门的水准, ...

  3. svn Can't revert without reverting children 解决方案

    EMZ3.0 qrh$ svn commit -m ""svn: E155010: Commit failed (details follow):svn: E155010: '/U ...

  4. java代码I/O流类

    package com.aini; //流类rr //流操作的步骤: /*1.找到指定File 2.实例化字节流.InputStream/OutputStream/Reader/Writer 3.读/ ...

  5. mongo shell命令

    https://docs.mongodb.com/manual/mongo/ 一.MongoDB客户端使用 1.mongo:启动mongo的客户端,和mongo客户端的登录 [root@cmos1 b ...

  6. Java-API-Package:org.springframework.beans.factory.annotation

    ylbtech-Java-API-Package:org.springframework.beans.factory.annotation 1.返回顶部 1. @NonNullApi @NonNull ...

  7. DCloud:目录

    ylbtech-DCloud:目录 1.返回顶部 1.5+ App开发入门指南 http://ask.dcloud.net.cn/article/89 2.   3. 2.返回顶部   3.返回顶部 ...

  8. Oracle redo 日志损坏的几种情况下的恢复

    Oracle redo 日志损坏的几种情况下的恢复 第一:损坏的redo为非正在使用的redo log 1.归档模式,不是当前正在日志损坏,数据库打开模式. 模拟损坏:SQL> select * ...

  9. Rails的静态资源管理(三)—— 开发环境的Asset Pipelin

    官方文档:http://guides.ruby-china.org/asset_pipeline.html http://guides.rubyonrails.org/asset_pipeline.h ...

  10. SQL修改日期时间型数据中的年月日

    以下语句为更改 tevent表中的eventtime字段为2011-7-16当eventtime为2012-02-29时 update tevent set  eventtime='2011-7-16 ...