您现在的位置： 365建站网 > 365文章 > 关于javascript中的事件学习及总结

关于javascript中的事件学习及总结

文章来源：365jz.com 点击数：350 更新时间：2009-09-18 10:32 参与评论

1关于事件对象
ie:事件对象是window对象的一个属性event
dom：event对象是作为唯一参数传递给事件处理函数。arguments[0]

2关于IE与DOM事件兼容性的总结(参考javascript高级程序设计)

DOM属性/方法	IE属性/方法
altKey	altKey
bubbles	-
button	button
cancelBubble	cancelBubble
charCode	keyCode
clientX	clientX
clientY	clientY
ctrlKey	ctrlKey
currentTarget	-
detail	-
eventPhase	-
isChar	-
keyCode	keyCode
metaKey	-
pageX	clientX+document.body.scrollLeft
pageY	clientY+document.body.scrollTop
preventDefault()	returnValue = false
relateTarget	fromElement/toElement
screenX	screenX
screenY	screenY
shiftKey	shiftKey
stopPropagation()	cancelBubble = true
target	srcElement
timeStamp	-
type	type

具体的属性和方法意思我就不写清楚了，有不太明白的可以baidu、google一下~

3关于跨平台事件（针对第二点各个属性在ie和ff下的不同）
在这里javascript高级程序设计一书总结了一个容器对象，可以方便的解决事件兼容性问题。
具体如下：

EventUtil

4里面会用到判断浏览器是什么牌子的另一个脚本（detect.js）
具体代码如下：

detect.js

4相关测试代码。

test

5在自己测试中遇到的两个问题。
1用addEventLisenter(dom)/attachEvent(ie)时如果针对的事件触发对象是window，
事件函数必须写为声明式的像这样function foo(){}

//错误的写法(变量式)ie会报语法错误
<script>
window.attachEvent("onload",foo);
   var foo = function()
   {
   alert("loaded");
   };
</script>
//正确的写法（声明式）
<script>
window.attachEvent("onload",foo);
  function foo()
   {
   alert("loaded");
   };
</script>

其他的页面元素则两者皆可。

问题二：关于同一对象连续使用attachEvent执行顺序的问题
猜猜会先执行那一个alert?

<html>

<head>

var app = function()

{

var obj = document.getElementById("mypp");

obj.attachEvent("onclick",foo1);

obj.attachEvent("onclick",foo2);

}

var foo1 = function()

{

alert("clicked!");

};

var foo2 = function()

{

alert("also clicked!");

};

</script>

</head>

</body>

</html>

答案是上面的代码会先执行第二个alert。
如果你觉得你的思维是正确的那么再看看下面的代码：

test2

一段关于此的英文解释：
When event fires on the object, the object's event handler is called before pDisp, the specified function. If you attach multiple functions to the same event on the same object, the functions are called in random order, immediately after the object's event handler is called.
引用网上一位高人说的：
并不是什么随机问题，你可以去研究研究哈希对象，这种对象插入新元素的时候并不是顺序插入的，而是根据计算所得的hash值而定的，但在取用这些对象的时间是按照一定的顺序取的，所以就会出现你这种所谓的乱序问题。我估计DHTML里的这些对象的事件处理函数存放及JS对象都是一个个哈希对象，都是key-value这种键值对的模式。

所以在使用上还是要慎重的，最好不要做依赖于顺序的设计。

Tag标签: javascript,事件,event