Question

我用js创建了一个div（var div = document.createElement（“div”）;）。现在我想在创建div之后插入一个onclick-function。出于某种原因，当我单击playfield时触发onclick-function。

var create_divs = function(check_if_right_div){
                  var random_class = Math.floor((Math.random() * 5) + 1);
                  var id = div_id += 1;
                  var random_position = 0 + 100*Math.floor(Math.random()*6);
                  var div = document.createElement("div");

                  div_id_selection.push('div' + id);


                  div.className = 'class'+random_class;
                  div.id = 'div' + id;
                  div.style.left = random_position;
                  div.addEventListener("click",check_if_right_div(div));//the function is triggered when I click the playfield, which is a big div that contains the other divs


                  document.getElementById('play_field').appendChild(div);
                  
                  
                  var check_if_right_div = function(div_to_check){
                                           var div_class =div_to_check.className;
                                             console.log(div_class);

                  };

Answer 1

你需要这样做

div.onclick = function(){ 
   check_if_right_div(div); 
};

当你执行这个check_if_right_div（div）它的函数执行时，它意味着通过制作这个div.addEventListener（“click”，check_if_right_div（div））;你执行函数check_if_right_div（div）

Answer 2

您提供的代码不完整。但是，EventTarget.addEventListener是向元素添加侦听器的现代首选方法。

备注

为什么要使用addEventListener？

addEventListener是将事件监听器注册为的方式   在W3C DOM中指定。它的好处如下：


它允许为事件添加多个处理程序。这对于DHTML库或Mozilla扩展特别有用   需要与其他库/扩展一起使用。

当听众被激活时（捕捉与冒泡），它可以让你对相位进行更精细的控制。

它适用于任何DOM元素，而不仅仅是HTML元素。

＆＃13;
＆＃13;
const playField = document.getElementById('play_field'); const div = document.createElement('div'); div.id = 'myDiv'; div.className = 'myClass'; const onClickHandler = event => console.log(event.target.className); div.addEventListener('click', onClickHandler, false); playField.appendChild(div);
＆＃13;
.myClass { width: 100px; height: 100px; background-color: red; }
＆＃13;
<div id="play_field" />
＆＃13;
＆＃13;
＆＃13;

使用click-function创建div（普通Java脚本）

2 个答案: