Question

为什么 JavaScript 找不到给定的 InnerHTML 并返回无法设置属性“innerHTML”为 null？

2012-09-09

705

javascript addeventlistener

为什么网站 http://xn--wiadomesny-37b.pl/test/ 会抛出 Uncaught TypeError: Cannot set property 'innerHTML' of null ?

HTML ( http://xn--wiadomesny-37b.pl/test/ ):

<div class="castle_array" id="2x1" name="2x1"></div>
<div class="castle_array" id="3x1" name="3x1"></div>
<div class="castle_array" id="4x1" name="4x1"></div>
...

JavaScript ( http://xn--wiadomesny-37b.pl/test/B_modeWindow.js ):

for (x = 1; x <= 5; x++) {
for (y = 1; y <= 5; y++) {
  document.getElementById(x+"x"+y).addEventListener("click",B_modeWindow('1',this.id));
}}

当我将

("click",B_modeWindow('1',this.id)

更改为

("click",B_modeWindow('1','string')

它运行正常 - 为什么？

Answer 1

您的代码存在两个基本问题。

首先，当您执行 addEventListener("click", B_modeWindow('1', this.id)); 时，您没有将 B_modewindow 回调分配给点击事件处理程序，您实际上是在执行该函数。

其次，在该上下文中 this 不引用被点击的元素，它引用 Window 对象，因此 this.id 为您提供 undefined ，请改用 event.target.id ：

要修复此问题，请改用以下命令：

var el = document.getElementById(x+"x"+y);
el.addEventListener("click", function (event) {
  B_modeWindow('1', event.target.id);
});

这是一个简化的演示。