0

我正在尝试将点击处理程序附加到我动态创建并添加到 li 元素的元素。当我尝试将它附加到 li 元素时，它不起作用。但是当我尝试将它添加到更高级别的 div 甚至 ul 元素时，点击处理程序就会起作用。

这没有给我点击事件：

var ul = document.createElement('ul');
ul.setAttribute('class','list');
main_div.appendChild(ul);

var li = document.createElement('li');
ul.appendChild(li);

var checkbox = document.createElement('div');
checkbox.setAttribute('class','checkBtn-unselected');
checkbox.onclick = function(){alert('foo');};
li.appendChild(checkbox);

这确实给了我点击事件：

var ul = document.createElement('ul');
ul.setAttribute('class','list');
main_div.appendChild(ul);

var li = document.createElement('li');
ul.appendChild(li);

var checkbox = document.createElement('div');
checkbox.setAttribute('class','checkBtn-unselected');
checkbox.onclick = function(){alert('foo');};
ul.appendChild(checkbox);

我也在使用英特尔的 App 框架/UI。我不知道这可能与它有什么关系。此外，在其他地方，我已经能够编写 HTML 并将我的复选框放在其中，它似乎可以工作。只有当我尝试动态创建它时，事件处理程序才不会运行。

4

2 回答 2

0

问题是我的复选框旁边有一个标签。标签的填充（具有一些相对定位模糊性）与我的按钮重叠并拦截了触摸/单击事件。我更改了标签的 css，所以它没有与我的按钮重叠，现在它可以工作了。

于 2014-08-19T16:44:25.353 回答
0

你的代码很好，但是复选框 DIV 的高度是0这样你的点击不会被触发，li有一个20px. 我添加了这个并点击作品：

checkbox.style.height = "40px";

这是完整的代码：http: //jsbin.com/moqoge/7/edit

于 2014-08-13T21:07:58.677 回答