javascript - 如何从组中随机选择一个 div 并为其分配一个事件

Question

我正在尝试从组中随机选择一个 div 并将点击事件分配给所选的一个。以下是我迄今为止编写的代码。

<div id="div1"> </div>
<div id="div2"> </div>
<div id="div3"> </div>
<div id="div4"> </div>

<script>

var div1 = document.getElementById("div1");
var div2 = document.getElementById("div2");
var div3 = document.getElementById("div3");
var div4 = document.getElementById("div4");



var randomnumber = Math.floor(Math.random() * (4 - 1 + 1)) + 1;

var bomb = "div" + randomnumber;


alert(bomb);

bomb.onclick = function() { alert("You clicked me...BOOM!")}; // does not work


</script>

Answer 1

您正在设置onclick字符串炸弹的属性，而不是元素。

采用

document.getElementById(bomb).onclick = function() { alert("You clicked me...BOOM!")};

如果您不想替换现有的点击侦听器，也可以使用addEventListener ：

document.getElementById(bomb).addEventListener(function() {
   alert("You clicked me...BOOM!")
});

Answer 2

如果那是您的实际脚本，请尝试以下操作：

var bomb = window['div' + randomnumber].onclick = function(){alert('You clicked me... BOOM!');};

如果这不是实际脚本，只需替换window[为this[, 即可引用当前上下文。

当然，@dystroy 的方法也很好用。我刚刚添加它是为了向您展示一种使用字符串引用变量的方法