问题通常是由于事件处理程序被重复绑定导致的。 解决方法是在绑定新事件之前删除旧事件。以下是一个示例解决方案:
HTML:
JavaScript:
//获取按钮元素
var myButton = document.getElementById("myButton");
//绑定按钮点击事件
myButton.addEventListener("click", handleClick);
//定义按钮点击处理程序
function handleClick() {
//获取文本内容
var text = document.getElementById("myDiv").innerHTML;
//向控制台打印文本内容(用于测试目的)
console.log(text);
//更改文本内容
document.getElementById("myDiv").innerHTML = "Click worked!";
//移除事件监听器
myButton.removeEventListener("click", handleClick);
}
在上述示例代码中,我们使用 removeEventListener
来删除 handleClick
的事件监听器。这确保每次单击按钮时只绑定一个事件,解决了 innerHTML
无法正常工作的问题。
下一篇:按钮递增计数器,但计数器然后重置