jQuery事件对象的属性
注:摘自《锋利的jQuery(第二版)》
JQuery在遵循W3C规范的情况下,对事件对象的常用属性进行了封装,使得事件处理在各大浏览器下都可以正常运行而不需要进行浏览器类型判断。
1. event.type()方法
该方法的作用是可以获取到事件的类型。
$(function(){
$("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浏览器不同标准的差异。
$(function(){
$("a[href=http://www.nowamagic.net]").click(function(event) {
alert(event.target.href);//获取触发事件的<a>元素的href属性值
return false;//阻止链接跳转
});
})
以上代码运行后会返回"http://www.nowamagic.net"。
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.x()/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(){
$("a").mousedown(function(e){
alert(e.which) // 1 = 鼠标左键 left; 2 = 鼠标中键; 3 = 鼠标右键
return false;//阻止链接跳转
})
})
以上代码加载到页面后,用鼠标单击页面时,单击左、中、右键分别返回l、2、3。
8. event.metaKey()方法
针对不同浏览器对键盘中的 ctrl 按键解释不同,jQuery也进行了封装,并规定event.metaKey()方法为键盘事件中获取 ctrl 按键。
9. event.originalEvent()方法
该方法的作用是指向原始的事件对象。
jQuery事件对象的属性的更多相关文章
- jQuery 事件对象的属性
jQuery 在遵循 W3C 规范的情况下,对事件对象的常用属性进行了封装,使得事件处理在各大浏览器下都可以正常运行而不需要进行浏览器类型判断. (1) event.type 该方法的作用是可以获取到 ...
- JQuery事件对象的属性和方法
这是今天的总结,以后学习自己可以当参考书来读读.Event 对象代表事件的状态,比如事件在其中发生的元素.键盘按键的状态.鼠标的位置.鼠标按钮的状态.事件通常与函数结合使用,函数不会在事件发生前被执行 ...
- jQuery事件对象event的属性和方法
事件处理(事件对象.目标元素的获取,事件对象的属性.方法等)在不同浏览器之间存在差异,jQuery在遵循W3C规范的情况下做了封装统一 一.事件对象常用的属性: event.type:获取事件的类型, ...
- JavaScript 中的window.event代表的是事件的状态,jquery事件对象属性,jquery中如何使用event.target
http://wenda.haosou.com/q/1373868839069215 http://kylines.iteye.com/blog/1660236 http://www.cnblogs. ...
- 知识笔记:jQuery 事件对象属性小结
使用事件自然少不了事件对象.因为不同浏览器之间事件对象的获取,以及事件对象的属性都有差异,导致我们很难跨浏览器使用事件对象.jQuery中统一了事件对象,当绑定事件处理函数时,会将jQuery格式化后 ...
- jquery 事件对象属性小结
使用事件自然少不了事件对象. 因为不同浏览器之间事件对象的获取, 以及事件对象的属性都有差异, 导致我们很难跨浏览器使用事件对象. jQuery中统一了事件对象, 当绑定事件处理函数时, 会将jQue ...
- 深入学习jQuery事件对象
× 目录 [1]获取 [2]事件类型 [3]事件目标[4]当前元素[5]事件冒泡[6]默认行为[7]命名空间[8]返回值[9]键值 前面的话 在触发DOM上的某个事件时,会产生一个事件对象event, ...
- JQuery修改对象的属性值
JQuery修改对象的属性值 用到的便是JQuery提供的attr方法,获取属性值的基本结构为:$(obj).attr("属性名"):修改属性值的结构为:$(obj).attr(& ...
- jquery 事件对象笔记
jQuery元素操作 设置或获取元素固有属性 获取 prop(属性名) 修改 prop(属性名,值) 获取自定义属性 ...
随机推荐
- express框架目录结构
. ├── app.js ├── bin │ └── www ├── node_modules │ ├── body-parser │ ├── cookie-parser │ ├── ...
- [makefile] filter-out
$(filter-out ,) 名称:反过滤函数——filter-out.功能:以模式过滤字符串中的单词,去除符合模式的单词.可以有多个模式.返回:返回不符合模式的字串.示例: objects=mai ...
- WDLINUX (Centos5.8) 安装 soap
CENTOS5.8 PHP5.2.17 [PHP5.3.27版的看这里] WDLINUX (centos) 安装 soap====================================== ...
- Elevator(hdoj 1008)
Problem Description The highest building in our city has only one elevator. A request list is made u ...
- Razor学习(二)@Html标签
原文链接:http://blog.csdn.net/pasic/article/details/7093802 只是因为原文作者说的东西,还有很多作为基础知识的东西,我都没有掌握,所以总结在这里,蓝字 ...
- MYSQL 插入二进制数的 2 种方法。
方法 1.insert into TableName set column =''; 方法 2.insert into TableName .... values(.....); ---------- ...
- PF_RING packet overwrites
最近在用 PF_RING 抓包过程中,发现个灵异的现象,高流量丢包时, 经常会出现正在处理的包的内容被覆盖.开始,怀疑是不是自己程序有地方越界写了,后来发现,如果自己拷贝一份,然后处理拷贝的那份,永远 ...
- 为何visua studio看不到C++项目的LOG?
最近工程中添加了一个用C++编写的项目 它作为了我正式使用项目的引用 但是当我debug的时候 居然没有看到应该有的LOG 最后找到了解决方法,如下图所示: 右击你的正式项目,属性 改变调试器类型中的 ...
- OSCHina技术导向:开源企业ERP系统Opentaps
opentaps Open Source ERP + CRM 基于 Apache OFBiz (The Open For Business Project ) 构建, 是一款设计良好, 逐渐流行起来的 ...
- 【HDU 2013 猴子吃桃子】 尾递归与迭代
大一时的一道C语言练习题,可作为递归和尾递归转迭代的范例.HDU 2013 http://acm.hdu.edu.cn/showproblem.php?pid=2013 题意:猴子摘了sum个桃子,从 ...