1

请告诉我我们将如何以及在何处定义“addEventListener”

<script type="text/javascript">
  function doSomething() {
    alert('Image clicked');
  }

var myImage = document.getElementById('my_image_id');
myImage.addEventListener('click', doSomething, false);

</script>

HTML------------------------------------------------

<body>
  <img src="xxx.png" width="100px" height="100px" id="="my_image_id"/>
</body>

我得到一个错误myImage是null或not an object。

4

4 回答 4

2

您应该将代码放在标记之后，或者用函数包装代码并在文档准备好时执行函数。

您收到错误的原因是，当 document.getElementById('my_image_id'); 调用时，当时没有给定 id 的元素。我希望你明白了。

于 2013-09-05T06:25:22.697 回答
2

在附加事件侦听器之前，将其放入内部window.onload以等待 DOM 完全加载。另请注意，这addEventListener不适用于所有浏览器。要使其适用于所有浏览器，请尝试：

window.onload = function()
{
  var myImage = document.getElementById('my_image_id');
  if (myImage.addEventListener){
    myImage.addEventListener('click', doSomething, false);
  } else if (myImage.attachEvent){
       myImage.attachEvent('onclick', doSomething);
  }
}
于 2013-09-05T06:32:58.077 回答
1

在关闭之前添加它，<body>因为在执行相关脚本时 DOM 尚未到达“ my_image_id ”，例如：

<body>
<img src="xxx.png" width="100px" height="100px" id="my_image_id"/>
<script type="text/javascript">
function doSomething() {
    alert('Image clicked');
 }

 var myImage = document.getElementById('my_image_id');

 myImage.addEventListener('click', doSomething, false);
</script>
</body>

添加

if (myImage.addEventListener) {
  myImage.addEventListener('click', doSomething, false);
}
else if(myImage.attachEvent) { // FOR IE
  myImage.attachEvent('onclick', doSomething);
}
else { 
    //
}
于 2013-09-05T06:26:28.380 回答
1 
window.onload = function()
{
myImage.addEventListener('click', doSomething, false);
}
于 2013-09-05T06:28:29.150 回答