`
even713
  • 浏览: 17449 次
  • 性别: Icon_minigender_2
  • 来自: 上海
最近访客 更多访客>>
社区版块
存档分类
最新评论

Event对象之我的理解

阅读更多

前两天在发行正当口碰到个Bug,是我introduced,让我非常紧张,感到惭愧。

大致是这样的一个问题,我写段能描述问题的代码:

<body>
<div id="haha">sijoerere
<select id="dd" onchange="abc(event)" id="dd">
	<option value="a">aa</option>
	<option value="b">bb</option>
	<option value="c">cc</option>
</select>
</div>
</body>
<script>
function abc(event) {
	document.getElementById("haha").innerHTML="";
	event = event? event: window.event;
	var elm = event.srcElement? event.srcElement: event.target;
	alert(elm);
	alert(document.getElementById("dd"));
	var v = elm.value;
	alert(v);
}
</script>

 目的是select对象onchange的时候将获取的value拿去处理,同时要将div内容清空。

按照正常思维,肯定是先拿value,再清空的。

由于具体需求逻辑比较复杂,加上自己可能思维有点问题,总之我先清空再获取值了。

如果不跑程序,我认为这是行不通的。

当时觉得这是个低级错误,也觉得被自己吓到了,怎么会这么粗心?!当时解决的办法当然是调整顺序了。

 

回想一下,自己有测试啊,而且相当小心的,当时没发现啊,FF下测了,IE下- 没印象,IE没测?我无语,真是再小心也犯错!

这不去管,FF下测了通过了?说不通啊,内容都清空了,哪来的值呢?

。。。。。。。。。。。。。。

经过一番调试,总结出如下结论:

无论在IE还是FF,event对象是能捕获对应的对象的,包括对象上的值,这就是为什么第一次alert出来是object了。event对象是在事件发生时存在,事件结束时销毁,在event存在时所有相关的对象都在event中,这个能从firebug或IE的developer tools中观察到。所以即使父容器的innerHTML清空了,还是能拿到当时的对象和对象的值。

在这个例子中IE之所以与FF有区别,是因为select这个对象比较特殊,它其实是个集合。IE中的event包含了select对象却没有包含它的儿子,FF当然都包含了,所以结果是IE中js也不报错,返回的值为空,FF正常通过。

 

但是以后一定是要注重顺序,反复测试!

 

分享到:
评论

相关推荐

    window对象--event对象详解

    Event对象则是JavaScript事件处理中的核心,它包含了与特定事件相关的所有信息,如事件类型、事件目标等。 在深入讲解Window对象和Event对象之前,我们先了解一些基础概念。JavaScript是一种基于原型的动态类型语言...

    window.event 对象详解

    在JavaScript编程语言中,`window.event`对象是一个特殊对象,它与...尽管现代浏览器推荐使用`addEventListener`和事件处理函数参数来代替全局`window.event`,但在处理兼容性问题时,理解`window.event`仍然是必要的。

    Event 对象的使用方法

    Event对象在Web开发中扮演着至关重要的角色,它代表了一个事件的状态,包含了关于事件发生时的各种详细信息。例如,事件发生在哪个元素上、哪个键盘键被按下、鼠标的当前位置以及鼠标按钮的状态等。Event对象经常与...

    Javascript中的事件--Event对象

    理解`Event`对象及其属性和方法是成为熟练JavaScript开发人员的关键。通过掌握这些基础知识,你可以更有效地处理用户交互,创建响应式和动态的Web应用程序。无论你是初学者还是有经验的开发者,深入了解`Event`对象...

    javascript Event对象详解

    JavaScript中的Event对象是事件处理的核心部分,它包含了与事件相关的所有信息,如事件类型、触发事件的元素、鼠标和键盘的状态等。...因此,理解Event对象及其属性对于JavaScript开发人员来说至关重要。

    让Firefox支持event对象实现代码

    if (arg0.constructor == Event) // 如果找到event对象 return arg0; } func = func.caller; } return null; } ``` 在上述示例中,`SearchEvent`会查找调用链上第一个具有`Event`类型的参数,从而找到事件...

    Event对象详解

    理解Event对象对于编写交互式的Web应用至关重要。以下是对Event对象及其重要属性的详细解释: 1. **altKey**:这个属性用于检查用户是否按下了Alt键。如果Alt键被按下,altKey的值为TRUE,否则为FALSE。它是只读的...

    高手window.event对象详解

    ### 高手window.event对象详解 #### 一、概述 `window.event` 是一个非常重要的JavaScript内置对象,它主要用于处理浏览器中的各种事件。这个对象包含了有关事件的各种信息,例如触发事件的对象、事件类型以及与该...

    C#事件(event)使用方法详解

    委托(delegate)可以理解成为函数指针,不同的是委托是面向对象,而且是类型安全的。事件(event)和委托(delegate)之间的关系可以通过一个浅显的比方来说明,委托(delegate) 就像房屋租赁中介,当你把租房子的消息告知...

    Python编程之event对象的用法实例分析

    在Python编程中,Event对象是多线程环境下的一个重要工具,主要用于线程间的同步和通信。Event对象提供了一种简单的方式来协调多个线程的执行,确保它们...在编写多线程程序时,理解并熟练运用Event对象是非常重要的。

    event和srcElement说明,方法,技巧

    `event.srcElement`是`event`对象的一个属性,用于获取触发事件的DOM元素。这个属性在Internet Explorer(IE)浏览器中被广泛支持,但在非IE浏览器中,如Firefox、Chrome等,则使用`event.target`属性来达到相同的...

    timeEvent_demo

    描述中提到,这是一个学习`timeEvent`的小例子,可能是由一位教师创建并分享的,目的是让学生实践和理解如何使用这个功能。同时,也表明了分享资源的愿望,意味着这个示例可能包含一个完整的代码项目,名为"event_...

    易语言利用Event事件实现多线程暂停继续源码

    首先,我们需要创建一个Event对象,然后在线程的执行代码中,当需要暂停线程时,调用Event对象的“等待”方法,这会使当前线程进入等待状态,直到Event被触发。在线程外部,我们可以通过改变Event的状态来控制线程的...

    html5 eventsource

    HTML5 EventSource,也称为Server-Sent Events (SSE),是一种单向的、持久的连接技术,允许服务器主动地向客户端推送数据。这种技术在实时更新应用,如...学习这个例子可以帮助理解EventSource的实际应用和工作流程。

    event对象获取方法总结在google浏览器下测试

    在Google浏览器下,理解并掌握Event对象的获取方法对于编写兼容性良好的JavaScript代码至关重要。以下是对标题和描述中提及的Event对象获取方法的详细说明: 1. **方法一:通过事件处理函数参数获取** 这是最常见...

    jquery中event对象属性与方法小结

    本文将对jQuery的`event`对象进行深入的讲解,帮助开发者更好地理解和运用这些功能。 首先,`event.target`是事件触发的原始DOM元素,即使事件在冒泡过程中经过了其他元素,`event.target`始终指向事件最初的源头。...

    event兼容调用(IE,Firefox,Chrome)

    在IE和Chrome中,可以通过全局对象`window.event`直接访问到当前触发的事件对象。这意味着,无论事件监听器是在哪个元素上注册的,都可以通过`window.event`来获取到该事件的详细信息。 ```javascript if (typeof...

    JS和JQ的event对象区别分析

    在实际应用中,理解JS和JQ中的Event对象差异,可以帮助开发者更好地实现事件处理逻辑,提高代码的可维护性和可扩展性。特别是在使用如Backbone.js或React.js这样的框架时,对事件处理的深入理解能让你编写出更加高效...

    Jquery中Event对象属性小结

    在JavaScript和jQuery中,Event对象是一个非常重要的概念,它包含了与事件相关的一系列信息。当一个事件被触发时,如用户点击...通过深入理解并熟练运用Event对象的属性,开发者可以创建出更加动态和响应式的Web应用。

Global site tag (gtag.js) - Google Analytics