首页  >  文章  >  web前端  >  根据您提供的内容,以下是一些可能采用问题格式的文章标题: * **为什么添加到动态元素时我的 JavaScript `addEventListener` 在页面加载时会触发?** * **H

根据您提供的内容,以下是一些可能采用问题格式的文章标题: * **为什么添加到动态元素时我的 JavaScript `addEventListener` 在页面加载时会触发?** * **H

Barbara Streisand
Barbara Streisand原创
2024-10-28 11:48:51322浏览

Here are some potential article titles in a question format, based on your provided content:

* **Why Does My JavaScript `addEventListener` Fire on Page Load When Adding to a Dynamic Element?** 
* **How to Ensure Event Listeners Work Correctly with Dynami

页面加载时触发 JavaScript“addEventListener”事件

将事件监听器附加到动态创建的元素时,必须确保监听器是正确绑定以在所需时间触发事件。

在提供的脚本中,事件在页面加载时触发,因为事件侦听器是在创建元素并将其插入 DOM 之前添加的。要纠正此问题,应考虑以下方法:

  • 首先创建元素: 在页面中编写元素的 HTML 或使用 document.createElement() 动态生成它.
  • 在 DOM 中查找元素:使用 document.getElementById() 检索元素。
  • 正确添加事件监听器:附加使用 addEventListener() 的事件监听器。不要直接传递警报函数,而是将其包装在匿名函数中,以便在事件发生时执行它。

更正后的脚本应如下所示:

<code class="javascript">document.write("<div id=\"myDiv\">I am a div</div>");
el = document.getElementById("myDiv");
el.addEventListener("click", function() { alert("clicktrack"); }, false);</code>

通过以下方式通过这些步骤,一旦元素存在于 DOM 中,事件侦听器就会附加到该元素,并且当单击该元素时将触发该事件。

以上是根据您提供的内容,以下是一些可能采用问题格式的文章标题: * **为什么添加到动态元素时我的 JavaScript `addEventListener` 在页面加载时会触发?** * **H的详细内容。更多信息请关注PHP中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn