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()应 ...
随机推荐
- hadoop结构出现后format变态
14/07/10 18:50:47 FATAL conf.Configuration: error parsing conf file: com.sun.org ...
- android xUtils的使用
gethub地址:https://github.com/wyouflf/xUtils/ xUtils简介 xUtils 包含了很多实用的android工具. xUtils 支持大文件上传,更全面的ht ...
- PropertyGrid--为复杂属性提供编辑功能
零.引言 PropertyGrid用来显示某一对象的属性,但是并不是所有的属性都能编辑,基本数据类型(int, double等)和.Net一些封装的类型(Size,Color等)可以编辑,但是对于自己 ...
- jQuery Tags Input Plugin 插件的使用
一个jquery开发的标签功能加强插件,可以生成或删除标签,还能对输入重复标签进行检查,和JQuery autocomplete插件配合实现自动完成功能. 官网:http://xoxco.com/pr ...
- JAVASCRIPT——文字出现效果练习
写一句诗.诗的最初状态是隐藏的,效果是让诗缓慢出现,直到显示完全 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional// ...
- jQuery 随滚动条滚动效果 (适用于内容页长文章)
直接入题! 当内容页比较长的时候,网站右侧一直是空白,不如放点有用的东西给用户看,最好不要放广告,因为那样很邪恶,你懂的. 好吧,昨天写了这个东西,jQuery滚动随动区块,代码如下: //侧栏随动 ...
- ps切片
(一)我们需要把中间的图切成一块一块. 首先在放入PS中: [视图]——>[标尺],为的是能够精确的切图: 标尺打开后上下左右都可以往图中拉线,我们在这边叫作(参考线),然后使用左边的[放大镜] ...
- ecshop使用Google API及OAuth2.0登录授权(PHP)
一.申请clientID https://console.developers.google.com/project 二.开启Google+ API权限 https://console.develop ...
- Spring与Hibernate两种组合方式
第一种 1.hibernate.cfg.xml文件 xml version='1.0' encoding='utf-8'?> "-//Hibernate/Hibernate Confi ...
- 为程序指定运行时所在的CPU核
internal class Program { [DllImport("kernel32.dll")] private static extern uint GetTickCou ...