动态添加元素的 Addinf 事件侦听器 - HTML/JS

Addinf event listeners for Dynamically added elements - HTML/JS

本文关键字：HTML JS 侦听器 事件 添加 元素 Addinf 动态      更新时间：2023-09-26

我正在尝试为使用JavaScript动态添加的HTML元素添加事件侦听器。类似的东西我的主页上有一个div

<div id="someid"></div>

并单击一个按钮，其事件侦听器

document.getElementById("someid").innerHTML = "<input type='button' id ='ad' value='Add' style='height:30px; width:90px'/>"
document.getElementById("ad").onclick = notherFunc;

那个函数就像

function notherFunc(){
      alert("WORKING")
}

但它不起作用。有没有办法将该按钮与函数绑定？

您需要使用一种称为"事件委派"的技术。实质上，您需要将单击处理程序绑定到确实存在的元素，并查看单击的元素是否是您期望的元素。

document.getElementById("someid").addEventListener("click", function (e) {
    if (e.target.id === "ad") {
        notherFunc();
    }
});
相关文章：