Js获取事件对象代码


Posted in Javascript onAugust 05, 2010

一般做法:

<input type="button" id="test" value="点我测试" /> 
<script type="text/javascript"> 
var testBtn = document.getElementById('test'); 
testBtn.onclick = testFun; 
function testFun(e) 
{ 
var evt = e || window.event; 
alert(evt); 
} 
</script>

或者:
<input type="button" id="test" value="点我测试" /> 
<script type="text/javascript"> 
var testBtn = document.getElementById('test'); 
if(window.addEventListener) 
{ 
testBtn.addEventListener('click', testFun, false); 
} 
else if(window.attachEvent) 
{ 
testBtn.attachEvent('onclick', testFun); 
} 
function testFun(e) 
{ 
var evt = e || window.event; 
alert(evt); 
} 
</script>

返回的值都是 “[object Event]“。
但如果是这种方式呢?
<input type="button" id="test_1" value="点我测试" onclick="testFun_1()" /> 
<script type="text/javascript"> 
function testFun_1() 
{ 
//此处如何获得? 
} 
</script>

“内事不决问百度,外事不决问谷歌”, 此言不虚。搜索了下,答案还真不少,不过大多数雷同(可能是巧合)。
https://3water.com/article/19408.htm
http://www.cnblogs.com/cuixiping/archive/2008/04/13/1150847.html
愚公 的这个文章(貌似转帖)还是颇有见解的。
<input type="button" id="test_1" value="点我测试" onclick="testFun_1()" /> 
<script type="text/javascript"> 
function testFun_1() 
{ 
var evt = getEvent(); 
alert(evt); 
} 
function getEvent(){ 
if(window.event) return window.event; //这里用对象检测更为妥当 
func=getEvent.caller; 
while(func!=null){ 
var arg0=func.arguments[0]; 
if(arg0){ 
if((arg0.constructor==Event || arg0.constructor ==MouseEvent) 
|| (typeof(arg0)=="object" && arg0.preventDefault && arg0.stopPropagation)){ 
return arg0; 
} 
} 
func=func.caller; 
} 
return null; 
} 
</script>

一般来说,很少用到这种嵌入式的写法(js写在html标签中 onclick="testFun_1()"),也不推荐使用这种方法,会造成维护和开发的麻烦。
Javascript 相关文章推荐
可以支持多中格式的JS键盘
May 02 Javascript
不定义JQuery插件 不要说会JQuery
Mar 07 Javascript
5个最顶级jQuery图表类库插件【jquery插件库】
May 05 Javascript
Bootstrap中表单控件状态(验证状态)
Aug 04 Javascript
详解AngularJs中$sce与$sceDelegate上下文转义服务
Sep 21 Javascript
js 函数式编程学习笔记
Mar 25 Javascript
angularJs中$http获取后台数据的实例讲解
Aug 08 Javascript
Flutter实现仿微信底部菜单栏功能
Sep 18 Javascript
webpack 最佳配置指北(推荐)
Jan 07 Javascript
JS实现简易留言板增删功能
Feb 08 Javascript
浅析vue-router实现原理及两种模式
Feb 11 Javascript
vue3.0生命周期的示例代码
Sep 24 Javascript
zeroclipboard复制到剪切板的flash
Aug 04 #Javascript
jQuery Study Notes学习笔记 (二)
Aug 04 #Javascript
JQuery Study Notes 学习笔记(一)
Aug 04 #Javascript
jQuery dialog 异步调用ashx,webservice数据的代码
Aug 03 #Javascript
基于jquery的让textarea自适应高度的插件
Aug 03 #Javascript
jQuery的实现原理的模拟代码 -4 重要的扩展函数 extend
Aug 03 #Javascript
jQuery的实现原理的模拟代码 -3 事件处理
Aug 03 #Javascript
You might like
图书管理程序(三)
2006/10/09 PHP
一个简单的PHP投票程序源码
2007/03/11 PHP
php实现的支持断点续传的文件下载类
2014/09/23 PHP
PHP错误机制知识汇总
2016/03/24 PHP
laravel 之 Eloquent 模型修改器和序列化示例
2019/10/17 PHP
javascript 同时在IE和FireFox获取KeyCode的代码
2010/02/07 Javascript
JS无法捕获滚动条上的mouse up事件的原因猜想
2012/03/21 Javascript
通过Javascript将数据导出到外部Excel文档的函数代码
2012/06/15 Javascript
jquery组件使用中遇到的问题整理及解决
2014/02/21 Javascript
JS+CSS实现的经典tab选项卡效果代码
2015/09/16 Javascript
限制只能输入数字的实现代码
2016/05/16 Javascript
JS实现title标题栏文字不间断滚动显示效果
2016/09/07 Javascript
Javascript的动态增加类的实现方法
2016/10/20 Javascript
JS闭包与延迟求值用法示例
2016/12/22 Javascript
Nodejs多站点切换Htpps协议详解及简单实例
2017/02/23 NodeJs
Angular2中select用法之设置默认值与事件详解
2017/05/07 Javascript
微信小程序url与token设置详解
2017/09/26 Javascript
浅谈Webpack核心模块tapable解析
2018/09/11 Javascript
一篇文章,教你学会Vue CLI 插件开发
2019/04/17 Javascript
vue element-ui之怎么封装一个自己的组件的详解
2019/05/20 Javascript
layui添加动态菜单与选项卡 AJAX请求的例子
2019/09/25 Javascript
卸载vue2.0并升级vue_cli3.0的实例讲解
2020/02/16 Javascript
js实现前端界面导航栏下拉列表
2020/08/27 Javascript
Antd-vue Table组件添加Click事件,实现点击某行数据教程
2020/11/17 Javascript
JavaScript实现瀑布流布局的3种方式
2020/12/27 Javascript
Python实现简单遗传算法(SGA)
2018/01/29 Python
Python实现的银行系统模拟程序完整案例
2019/04/12 Python
Python 必须了解的5种高级特征
2020/09/10 Python
35款精致的 CSS3 和 HTML5 网页模板 推荐
2012/08/03 HTML / CSS
美体小铺瑞典官方网站:The Body Shop瑞典
2018/01/27 全球购物
西班牙鞋子和箱包在线销售网站:zapatos.es
2020/02/17 全球购物
内部类的定义、种类以及优点
2013/10/16 面试题
环保标语大全
2014/06/12 职场文书
领导干部个人对照检查材料(群众路线)
2014/09/26 职场文书
小学生红领巾广播稿
2015/08/19 职场文书
JavaScript实现简单拖拽效果
2021/09/15 Javascript