javascript attachEvent 事件

chinabolt 2007-10-12 02:52:20
我用 attachEvent 来动态添加事件 可没有什么效果

大家帮我看看错在哪里呢!
代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>动态注册事件</title>
<script type="text/javascript">
var obj = document.getElementById("btn");
if(window.addEventListener){ // Mozilla, Netscape, Firefox
obj.addEventListener('click', alert('第一个方法（非IE浏览器）'), false);
obj.addEventListener('click', alert('第二个方法（非IE浏览器）'), false);
obj.addEventListener('click', fun3, false);
}
else{ // IE
obj.('onclick', function(){alert('第一个方法（IE浏览器）');});
obj.attachEvent('onclick', function(){alert('第二个方法（IE浏览器）');});
obj.attachEvent('onclick', fun3);
}
function fun3(){
alert("第三个方法（IE浏览器）");
}
</script>
</head>

<body>
<form name="form1" method="post" action="">
<input type="button" id="btn" value="注册事件方法" />
</form>
</body>
</html>
...全文
7489 11 打赏 收藏 转发到动态 举报
写回复
用AI写文章
11 条回复
切换为时间正序
请发表友善的回复…
发表回复
BLUE_LG 2011-08-04
  • 打赏
  • 举报
 回复
将script部分放到<input type="button" id="btn" value="注册事件方法" /> 之后，不然获取不到obj

当然也可以window.onload中调用上述js部分。
no7dw 2010-08-22
  • 打赏
  • 举报
 回复
[Quote=引用 7 楼 alice200505 的回复:]

JGood
为什么在IE中，添加的事件执行的循序不是按照添加的顺序来的，而是反的。即先执行alert("第三个方法（IE浏览器）");，然后再alert( '第二个方法（IE浏览器） ');，最后才alert( '第一个方法（IE浏览器） ');？？
[/Quote]
同问！！
请教~~
no7dw 2010-08-22
  • 打赏
  • 举报
 回复
还有：
应该是：


  obj.addEventListener('click', function() { alert('第一个方法（非IE浏览器）  ') }, false);

  obj.addEventListener('click', function() { alert('第二个方法（非IE浏览器）  ') }, false);

  obj.addEventListener('click', fun3, false);

而不是


  obj.addEventListener('click', alert('第一个方法（非IE浏览器）'), false);

  obj.addEventListener('click', alert('第二个方法（非IE浏览器）'), false);

  obj.addEventListener('click', fun3, false);

基于以上高人的对比得出的。估计是语法问题。
no7dw 2010-08-22
  • 打赏
  • 举报
 回复 


..

else{ // IE

  obj.('onclick', function(){alert('第一个方法（IE浏览器）');});

  obj.attachEvent('onclick', function(){alert('第二个方法（IE浏览器）');});

..

1.首先：
obj.('onclick',
应该改为：
obj.attachEvent
2.如JGood所示需要把顺序调换1下：


<form>

..

</form>

<script>..</script>

否则obj is null .
原因不知，但是是在调试的时候发现的。VS 提示 obj is null
Justin-Amber 2008-03-13
  • 打赏
  • 举报
 回复
JGood
为什么在IE中，添加的事件执行的循序不是按照添加的顺序来的，而是反的。即先执行alert("第三个方法（IE浏览器）");，然后再alert( '第二个方法（IE浏览器） ');，最后才alert( '第一个方法（IE浏览器） ');？？
meizz 2007-10-12
  • 打赏
  • 举报
 回复 


<body>

<form name="form1" method="post" action=""  >

<input type="button" id="btn" value="注册事件方法" / > 

</form>

<script type="text/javascript">

if(!window.attachEvent && window.addEventListener)

{

  window.attachEvent = HTMLElement.prototype.attachEvent=

  document.attachEvent = function(en, func, cancelBubble)

  {

    var cb = cancelBubble ? true : false;

    this.addEventListener(en.toLowerCase().substr(2), func, cb);

  };

}



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

obj.attachEvent('onclick', function(){alert(  '第一个方法（IE浏览器）  ');});

obj.attachEvent('onclick', function(){alert(  '第二个方法（IE浏览器）  ');});

obj.attachEvent('onclick', fun3);



function fun3()

{

  alert("第三个方法（IE浏览器）");

}

</script>
hbhbhbhbhb1021 2007-10-12
  • 打赏
  • 举报
 回复
我的那个已经有反映了，看看具体有什么不一样，恐怕是写的地方小马虎差错了
JGood 2007-10-12
  • 打赏
  • 举报
 回复
在我的本机通过，支持IE与FF


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"  >

<html xmlns="http://www.w3.org/1999/xhtml"  >

<head  >

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" / >

<title >动态注册事件  </title >



</head >



<body >

<form name="form1" method="post" action=""  >

<input type="button" id="btn" value="注册事件方法" / > 

</form >

<script type="text/javascript" >

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

if(window.addEventListener){ // Mozilla, Netscape, Firefox

   obj.addEventListener(  'click', function(){alert(  '第一个方法（非IE浏览器）  ')}, false);

   obj.addEventListener(  'click', function(){alert(  '第二个方法（非IE浏览器）  ')}, false);

   obj.addEventListener(  'click', fun3, false);

}

else{ // IE

   obj.attachEvent(  'onclick', function(){alert(  '第一个方法（IE浏览器）  ');});

   obj.attachEvent(  'onclick', function(){alert(  '第二个方法（IE浏览器）  ');});

   obj.attachEvent(  'onclick', fun3);

  }

  function fun3(){

    alert("第三个方法（IE浏览器）");

  }

</script >

</body >

</html >
chinabolt 2007-10-12
  • 打赏
  • 举报
 回复
谢谢,不过好像还没有什么反应
JGood 2007-10-12
  • 打赏
  • 举报
 回复
事件名称是没有空格的，注意粗体部分
obj.attachEvent( 'onclick ', function(){alert( '第一个方法（IE浏览器） ');});
＝＝＞
obj.attachEvent( 'onclick', function(){alert( '第一个方法（IE浏览器） ');});
hbhbhbhbhb1021 2007-10-12
  • 打赏
  • 举报
 回复
顺序写反了
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
<html xmlns="http://www.w3.org/1999/xhtml" >
<head >
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>动态注册事件 </title>

</head>

<body>
<form name="form1" method="post" action="" >
<input type="button" id="btn" value="注册事件方法" />
</form>
<script type="text/javascript">
var obj = document.getElementById("btn");
if(window.addEventListener){ // Mozilla, Netscape, Firefox
obj.addEventListener( 'click ', alert( '第一个方法（非IE浏览器） '), false);
obj.addEventListener( 'click ', alert( '第二个方法（非IE浏览器） '), false);
obj.addEventListener( 'click ', fun3, false);
}
else{ // IE
obj.attachEvent( 'onclick', function(){alert( '第一个方法（IE浏览器） ');});
obj.attachEvent( 'onclick', function(){alert( '第二个方法（IE浏览器） ');});
obj.attachEvent( 'onclick', fun3);
}
function fun3(){
alert("第三个方法（IE浏览器）");
}
</script>
</body>
</html>
javascript attachEvent绑定多个事件执行顺序问题
执行顺序是没有规律的，但是每次执行的顺序是一样的，如果是随机那么应该每次执行的顺序都不一样才对，这才是我想要说明的
javascript attachEvent和addEventListener使用方法
attachEvent与addEventListener区别适应的浏览器版本不同，同时在使用的过程中要注意
javascript中attachEvent用法实例分析
本文实例讲述了javascript中attachEvent用法。分享给大家供大家参考。具体分析如下： 一般我们在JS中添加事件,是这样子的 obj.onclick=method 这种绑定事件的方式，兼容主流浏览器,但如果一个元素上添加多次同一事件...
Javascript attachEvent传递参数的办法
找了半天找到的解决办法，看介绍说是javascript的闭包问题，导致得不能直接读取外部的那个函数，不然就所有传递的参数都变为最后一个了。
JavaScript通过attachEvent和detachEvent方法处理带参数的函数
通过 attachEvent 和 detachEvent 方法处理带参数的函数(示例代码)
JavaScript

87,923

社区成员

224,618

社区内容

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今

加载中

查看更多榜单
社区公告
暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章