Js获取事件对象代码
更新时间：2010年08月05日 03:30:31 作者：
js下比较实用的事件绑定代码，学习js 的朋友一定要学习的，为你的页面增加更好的交互。
一般做法：
<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://www.jb51.net/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()"），也不推荐使用这种方法，会造成维护和开发的麻烦。
复制代码 代码如下:
<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://www.jb51.net/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的offset、client、scroll使用方法详解
- js中top、clientTop、scrollTop、offsetTop的区别 文字详细说明版
- js中的scroll和offset 使用比较的实例与分析
- javascript scrollLeft,scrollWidth,clientWidth,offsetWidth 完全详解
- javascript中offset、client、scroll的属性总结
- js之事件冒泡和事件捕获详细介绍
- 阻止JavaScript事件冒泡传递（cancelBubble 、stopPropagation）
- javascript事件冒泡详解和捕获、阻止方法
- js中获取事件对象的方法小结
- JS的Event事件对象使用方法
- JS前端知识点offset，scroll，client，冒泡，事件对象的应用整理总结
相关文章
这篇文章主要是对Javascript中难以理解的11个问题进行了详细的分析介绍，需要的朋友可以过来参考下，希望对大家有所帮助2013-12-12
这篇文章主要介绍了详解用async/await来处理异步，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-08-08
这篇文章主要介绍了深入了解JavaScript代码覆盖 ,代码覆盖提供有关是否以及可选地应用程序的某些部分被执行的频率的信息。它通常用于判定一个测试套件执行特定代码库的全面程度。,需要的朋友可以参考下2019-06-06
这篇文章主要为大家详细介绍了JavaScript中文件上传API，介绍了上传文件API的使用方法，感兴趣的小伙伴们可以参考一下2016-04-04
这篇文章主要为大家详细介绍了微信小程序实现自定义底部导航，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2020-11-11
这篇文章主要介绍了微信小程序拍照和摄像功能实现方法,结合实例形式分析了微信小程序拍照与摄影功能的原理、相关实现技巧与注意事项,需要的朋友可以参考下2019-02-02
这篇文章主要介绍了JS sort排序详细使用方法示例解析,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下2020-09-09
这篇文章主要介绍了微信小程序跳转方式，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-04-04
为JS扩展Array.prototype.indexOf引发的问题探讨及解决
Array没有indexOf方法，这样在一个数组中查找某个元素的索引时比较麻烦，于是通过prototype原型扩展了Array.prototype.indexOf(),在对数组进行遍历的时候却出现了问题2013-04-04
js 剪切板的用法(clipboardData.setData)与js match函数介绍
这篇文章主要是对js中剪切板的使用方法(clipboardData.setData)与js中的match函数进行了介绍。需要的朋友可以过来参考下，希望对大家有所帮助2013-11-11
最新评论