介绍之前先介绍jQuery的一个方法 jQuery.event.fix(event || window.event); 此方法个浏览器的event对象转换为 jQuery.event; 如果您的事件是通过jQuery方法绑定的,就不需要进行转换了!

jQuery在遵循W3C规范的情况下,对事件的常用属性进行了封装,使得事件处理在各大浏览器下都可以正常的运行而不需要进行浏览器类型判断。

1.event.type属性
该方法作用是可以获取到时间的类型

$("a").click(function(event){
alert(event.type); //获取时间类型
return false; //阻止链接跳转
})

以上代码运行后会返回:“click”。

2.event.preventDefault()方法
该方法的作用是阻止默认的事件行为。JavaScript中符合W3C规范的preventDefault()方法在IE浏览器中无效。jQuery对其进行了封装,使之能兼容各种浏览器。

3.event.stopPropagation()方法
该方法是阻止事件的冒泡。JavaScript中符合W3C规范的stopPropagation()方法在IE浏览器中无效。jQuery对其进行封装,使之能兼容各种浏览器。

4.event.target属性
event.target属性的作用是获取到出发事件的元素。jQuery对其封装后,避免了W3C、IE和safari浏览器不同标准的差异。

$("a[href=http://www.jb51.net]").click(function(event){
alert(event.target.href); //获取触发事件的<a>元素的href属性值
alert(event.target.tagName); //获取触发事件的元素的标签名称
return false; //阻止链接跳转})

 5.event.relatedTarget属性
在标准DOM中,mouseover和mouseout所发生的元素可以通过event.target()方法来访问,相关元素是通过event.relatedTarget属性来访问的。event.relatedTarget属性在mouseover中相当于IE浏览器的event.fromElement属性,在mouseout中相当于IE浏览器的event.toElement,jQuery对其进行了封装,使之能兼容各种浏览器。

6.event.pageX/event.pageY属性
该方法的作用是获取到光标相对页面的x坐标和y坐标。如果没有使用jQuery时,那么IE浏览器中是用event/event.y方法,而在Firefox浏览器中用event.pageX/event.pageY方法。如果页上有滚动条,则还要加上滚动条的宽度和高度。在IE浏览器中还应该减去默认的2px的边框。

$(function() {
$("a").click(function(event) {
alert("Current mouse position:" + event.pageX + "," + event.pageY);
//获取鼠标当前相对于页面的坐标
return false; //阻止链接跳转
});
})

 7.event.which属性
该方法的作用是在鼠标单击事件中获取到鼠标的左、中、右键;在键盘事件中获取键盘的按钮。

$(function() {
$("body").mousedown(function(e) {
alert(e.which); //1 = 鼠标左键;2 = 鼠标中键;3 = 鼠标右键。
})
})

以上代码加载到页面中,用鼠标单击页面时,单击左、中、右键分别返回1、2、3.

8.event.metaKey属性
针对不同浏览器对键盘中的<ctrl>按键解释不同,jQuery也进行了封装,并规定event.metaKey()方法为键盘事件中获取<ctrl>按键。

9.event.originalEvent属性。
该方法的作用是指向原始的事件对象。

jQuery.event详细解析的更多相关文章

  1. ;(function($,window,undefined){})(jQuery,window)详细解析————借助B5教程解析自己整理了一下

    在jquery插件中我们经常看到以下这段代码 ;(function ( $, window, document, undefined ){ //函数体内具体代码 })(jQuery, window,d ...

  2. Jquery的详细解析和用法

    一.Jquery简介 Jquery是一个优秀的Javascrīpt框架.它是轻量级的js库(压缩后只有21k) ,它兼容CSS3,还兼容各种浏览器 (IE 6.0+, FF 1.5+, Safari  ...

  3. jquery.cookie用法详细解析,封装的操作cookie的库有jquery.cookie.js

    jquery.cookie用法详细解析 需要注意存入cookie前,对数据进行序列化, 得到后在反序列化: 熟练运用:JSON.stringify();和JSON.parse(): 通常分为如下几个步 ...

  4. jquery 源码解析 节点遍历

    jquery遍历,用于根据其相对于其他元素的关系来查找或选取html元素,以某项选择开始,并沿着这个选择移动,知道移动被称为对dom进行遍历 ☑ <div> 元素是 <ul> ...

  5. jQuery Ajax 全解析

    转自:http://www.cnblogs.com/qleelulu/archive/2008/04/21/1163021.html 本文地址: jQuery Ajax 全解析 本文作者:QLeelu ...

  6. jQuery Ajax 全解析(转载)

    本文地址: jQuery Ajax 全解析 本文作者:QLeelulu 转载请标明出处! jQuery确实是一个挺好的轻量级的JS框架,能帮助我们快速的开发JS应用,并在一定程度上改变了我们写Java ...

  7. jQuery源码解析资源便签

    最近开始解读jQuery源码,下面的链接都是搜过来的,当然妙味课堂 有相关的一系列视频,长达100多期,就像一只蜗牛慢慢爬, 至少品读三个框架,以后可以打打怪,自己造造轮子. 完全理解jQuery源代 ...

  8. jquery源码解析:代码结构分析

    本系列是针对jquery2.0.3版本进行的讲解.此版本不支持IE8及以下版本. (function(){ (21, 94)     定义了一些变量和函数,   jQuery = function() ...

  9. 【前端】原生event对象和jquery event对象的区别

    标准DOM event对象转换成 jQuery event对象 $(event) jQuery event对象转换成 标准DOM event对象 event.originalEvent

随机推荐

  1. ios 获得通讯录中联系人的所有属性 亲测,可行 兼容io6 和 ios 7

    //获取通讯录中的所有属性,并存储在 textView 中,已检验,切实可行.兼容io6 和 ios 7 ,而且ios7还没有权限确认提示. -(void)getAddressBook { ABAdd ...

  2. 打开IPHONE的sms.db短信文件 方法

    先将导出的sms.db文件改名为sms.sqlite再下载个火狐浏览器<IGNORE_JS_OP style="WIDOWS: 2; TEXT-TRANSFORM: none; BAC ...

  3. java中Double类数字太大时页面正常显示而不要用科学计数法

    /** * 当浮点型数据位数超过10位之后,数据变成科学计数法显示.用此方法可以使其正常显示. * @param value * @return Sting */ public static Stri ...

  4. Spring Websocket实现文本、图片、声音、文件下载及推送、接收及显示(集群模式)

    相关环境 Nginx,Spring5.x当前(要选择4.0+),tomcat8.x,Quartz 2.x集群(实际运用是Quartz的集群模式和单机模式共存的) 测试面页:http://sms.rey ...

  5. 女子监狱第一季/全集Orange Is the New Black迅雷下载

    本季第一季 Orange Is the New Black 1 (2013) 看点:该剧描述主人公Piper Chapman(Taylor Schilling)在大学里结识了毒贩Alex(Laura ...

  6. ios成长之每日一遍(day 2)

    接着下来简单说说Label(相当于android的textview)和button的使用, 由于都是与上篇的AppDelegate一致, 所以这一篇就说说ViewController与xib的使用呗. ...

  7. Android之仿iphone抖动效果

    转自:http://blog.csdn.net/long33long/article/details/7693671 布局文件: <?xml version="1.0" en ...

  8. [rrdtool]监控和自己主动绘图,简单的监控.md

    如今想要监控服务的流量和并发数,但是又没那么多时间来写系统.其它的运维系统又不熟悉,于是就用现有的rrdtool shell做了个简单的监控界面,暂时用下,也算是个小实验把. rrdtool也是刚接触 ...

  9. Java并发编程的艺术(七)——Executors

    Executors框架简介 Executor框架便是Java 5中引入的,其内部使用了线程池机制,它在java.util.cocurrent 包下,通过该框架来控制线程的启动.执行和关闭,可以简化并发 ...

  10. 浅谈Java Future接口

    Java项目编程中,为了充分利用计算机CPU资源,一般开启多个线程来执行异步任务.但不管是继承Thread类还是实现Runnable接口,都无法获取任务执行的结果.JDK 5中引入了Callable和 ...