[英]Event listener doesn't work when I add something to div.innerHTML
this is my code : 这是我的代码:
<html>
<head>
<script type="text/javascript" language="javascript">
function load() {
div1 = document.getElementById('div1');
div2 = document.getElementById('div2');
function clicky() {
alert('1');
}
div2.addEventListener('click', clicky);
//div1.innerHTML += 'ooooooofdsfdsfdsfdsfdsfsdfdsfdsfdsfdsklfdsjfkldsjfkldsjfldsjfkldsjfkldsjfdskl';
}
</script>
</head>
<body onload="load();">
<div id="div1" style="width : 300px; height : 300px; background-color : red; position : absolute">
<div id="div2" style="width : 20px; height : 20px; background-color : green; position : absolute; right : 5px; top : 5px;">X</div>
</div>
</body>
So, I have div2 in div1. 因此,我在div1中有div2。 If commented string is really commented, everything works : clicking on div2 causes alert.
如果注释字符串确实被注释,则一切正常:单击div2会引起警报。 But if I add smth to div1.innerHTML, event handler doesn't work.
但是,如果我将smth添加到div1.innerHTML,则事件处理程序将不起作用。 Where is the problem?
问题出在哪儿?
Your code 您的密码
div1.innerHTML += 'ooooooofdsfdsfdsfdsfdsfsdfdsfdsfdsfdsklfdsjfkldsjfkldsjfldsjfkldsjfkldsjfdskl';
actually means 实际上意味着
div1.innerHTML = div1.innerHTML + ooooooofdsfdsfdsfdsfdsfsdfdsfdsfdsfdsklfdsjfkldsjfkldsjfldsjfkldsjfkldsjfdskl';
So in literal sense, you are overwriting the innerHTML of div1 with a new string which inturn creates a new object of div2. 因此,从字面上看,您正在用新字符串覆盖div1的innerHTML,这反过来会创建div2的新对象。 Hence you need to add click listener after the innerHTML is set.
因此,您需要在设置innerHTML之后添加点击监听器。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.