javascript事件:获取事件对象getEvent函数
在javascript开发中我们会经常获取页面中的事件对象,然后来处理这些事件,例如下面的getEvent函数就是获取javascript下的页面事件对象。
function getEvent(event){
return event || window.event;
}
我们使用getEvent的时候可以这样调用。
并且把foo函数绑定到一个onclick事件上。
但是常用的是foo函数不会有参数,或者第一个参数没有传入,我们可以通过arguments[0]来获取第一个参数。
在IE中event是一个全局变量,即window.event,而在Firefox等浏览器,事件会作为第一个参数传入foo函数,所以getEvent可以改为:
function getEvent(event){
return arguments[0] || window.event;
}
这时在一些版本的浏览器,例如Firefox 中会出现获取不到event对象的问题,其实我们可以看成事件的触发是下面的方式:
function onclick(event) {
foo();
}
这样,第一个函数是onclick,即event会默认作为第一个参数传入,而foo函数没有将event作为参数传入,这样严重限制了getEvent的灵活性,所以我们需要修改下getEvent函数。
我们知道arguments.callee是函数本身,在匿名函数中可以作为递归使用,那么arguments.callee.caller指的是调用本函数的上一级函数的函数。
例如getEvent的caller为foo,foo的caller为onclick,依次类推……
所以我们的getEvent函数最终可以这样来写:
function getEvent(){
if(window.event){
return window.event;
}
var f = arguments.callee.caller;
do{
var e = f.arguments[0];
if(e && (e.constructor === Event || e.constructor===MouseEvent || e.constructor===KeyboardEvent)){
return e;
}
}while(f=f.caller);
}
javascript事件:获取事件对象getEvent函数的更多相关文章
- vue事件获取事件对象,vue获取事件源,vue event.currentTarget
js的事件,如点击事件,可以直接用this获取事件对象,而jQuery可以使用$(this)来获取事件对象.vue必须借助事件的 event 对象 的 currentTarget 才能获取事件对象 v ...
- MUI点击事件获取当前对象,及当前对象的属性值
//用惯了jquery,开始用mui还是有些不习惯 //直接贴代码吧 <nav class="mui-bar mui-bar-tab"> <a class=&qu ...
- vue事件获取当前对象
一.事件传参 如点击事件 <div @click='click'> <div> <div @click='click_1('msg')'> <div> ...
- javascript;Jquery;获取JSON对象,无刷新分页,异步加载,异步删除,实例。
AjaxNewsList: <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> < ...
- Javascript我学之六对象工厂函数与构造函数
本文是金旭亮老师网易云课堂的课程笔记,记录下来,以供备忘. 概述 使用对象字面量,或者向空对象中动态地添加新成员,是最简单易用的对象创建方法. 然而,除了这两种常用的对象创建方式,JavaScript ...
- JavaScript基础知识(对象、函数与对象)
17.对象 属性:描述对象的信息 方法:描述对象的行为 封装:只关心输入和输出(不管过程如何实现) ü 对象的分类: 内置对象(原生对象): 就是JavaScript语言预定义的对象(如Strin ...
- javascript;Jquery;获取JSON对象,无刷新评论实例。
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> < ...
- 从零开始学习jQuery (五) 事件与事件对象
本系列文章导航 从零开始学习jQuery (五) 事件与事件对象 一.摘要 事件是脚本编程的灵魂. 所以本章内容也是jQuery学习的重点. 本文将对jQuery中的事件处理以及事件对象进行详细的讲解 ...
- jQuery入门(3)事件与事件对象
jQuery入门(1)jQuery中万能的选择器 jQuery入门(2)使用jQuery操作元素的属性与样式 jQuery入门(3)事件与事件对象 jQuery入门(4)jQuery中的Ajax()应 ...
随机推荐
- 解决GitHub未配置SSH key提示错误信息
git push -u origin master Permission denied (publickey). fatal: Could not read from remote repositor ...
- 一道来自华为的C机试题目
题目是这样的 求一个字符串中连续字母的个数 比如I have a book. : 1 I have a dog. : 0 I haavee aa dogg : 4 #include <windo ...
- hdu 5595 GTW likes math(暴力枚举查询)
思路:直接暴力枚举区间[l,r]的整数值,然后max和min就可以了. AC代码: #pragma comment(linker, "/STACK:1024000000,1024000000 ...
- 使用Kotlin开发Android应用(I):简单介绍
使用Kotlin开发Android应用(I):简单介绍 @author ASCE1885的 Github 简书 微博 CSDN 原文链接 Kotlin是一门基于JVM的编程语言.它正成长为Androi ...
- HOOK钩子 - 钩子函数说明
翻译参考自MaybeHelios的blog: http://blog.csdn.net/maybehelios/ 通过SetWindowsHookEx方法安装钩子,该函数指定处理拦截消息的钩子函数(回 ...
- C#性能优化实践 资料整理
缓存(Cache)是性能优化中最常用的优化手段.适用的情况是频繁的获取一些数据,而每次获取这些数据需要的时间比较长.这时,第一次获取的时候会用正常的方法,并且在获取之后把数据缓存下来.之后就使用缓存的 ...
- css3波浪形loading动画
css3做个第一个动画,主要点在box-shadow和background的变化,虽然不难,但是还是有一定的技巧性的!备注下 html <div class="loading" ...
- PHP 源码加密扩展(php-beast)PHP7 版本发布
此版本主要支持PHP7,在github(https://github.com/liexusong/php-beast)上选择php7分支然后编译安装即可. 来源于:https://github.c ...
- 在MySQL数据库建立多对多的数据表关系
在数据库中,如果两个表的之间的关系为,多对多的关系,如:“学生表和课程表”,一个学生的可以选多门课,一门课也可以被多门学习选;根据数据库的设计原则,应当形成第三张关联表 步骤1:创建三张数据表Stud ...
- jupyter巨好玩-使用jupyter结合VScode写博客
打开jupyter-ipython 其实人家就叫jupyter了,后面咱可能就少提ipython了. # 打开命令行,让我们输入 jupyter notebook 当然,这个前提是你已经安装了jupy ...