开发者问题收集

无法读取 null 错误的属性“addEventListener”,不知道为什么

2014-04-14
18338

每当我将鼠标悬停在图像上时,它都不会放大并出现错误。

HTML 和 Javascript 代码(这是两个单独的文件):

var banner = document.getElementById("banner");

function enlargePic(){
banner.style.width = '800px';
banner.style.height  = '300px';
}

function normalPic(){
banner.style.width = '500px';
banner.style.height  = '200px';
}


banner.addEventListener("mouseover", enlargePic, false); 

banner.addEventListener("mouseout", normalPic, false); 

<div id="designs">
<a id="designs"></a>
<h1>DESIGNS.</h1> 
<table>
<tr>
<td><img src="banner2.jpg" id="banner"></td>
</tr>
</table>
</div>
2个回答

您的 javascript 代码位于第一部分。因此它已在 banner 元素之前呈现,并且无法找到元素 id = banner,因为它尚未呈现。尝试在 html 代码之前找到该代码。

Matricore
2014-08-01

引用函数 normalpic 时,应在其前面加上一个空函数:

banner.addEventListener("mouseout",function(){normalpic},false)
Treacle
2014-08-06