为啥onclick处理程序在javascript中与innerHTML一起使用时不起作用[重复]
Posted
技术标签:
【中文标题】为啥onclick处理程序在javascript中与innerHTML一起使用时不起作用[重复]【英文标题】：why onclick handler didnt work when it use with innerHTML in javascript [duplicate]为什么onclick处理程序在javascript中与innerHTML一起使用时不起作用[重复] 【发布时间】：2014-04-16 22:41:57 【问题描述】：<html>
<head>
<script>
window.onload = function()
var para = document.createElement("p");
para.innerHTML = "aaaa";
document.body.appendChild(para);
var bspan = document.createElement("span");
bspan.innerHTML = "bbbb";
para.appendChild(bspan);
bspan.onclick = function()
alert("hi");
para.innerHTML += "cccc";
</script>
</head>
<body>
</body>
</html>
这是我的代码，我希望当我点击 bbbb 时它会提醒你，但它显然不起作用，为什么？
【问题讨论】：
你的意思是spa 是bspan 吗？ （2处错字）
@SteveHoward 已更正但仍然无效
如果您评论para.innerHTML += "cccc"，它可以工作。我想把它扔出去供你参考。我还在做这个。
好的，谢谢@MikeMarks，但是为什么会发生这种情况
【参考方案1】：
由于您没有使用 jQuery，以下是使用 javascript 进行事件委托的简单示例，因为您的 span 元素是从代码生成的，因此请尝试一下：
document.onclick = function(event)
var el = event.target;
if (el.nodeName.toLowerCase() == "span")
alert("hi");
;
Fiddle
【讨论】：
我能知道为什么我的代码不起作用吗？？ 这是因为您在运行时创建了span。 Here 是了解它的宝贵帖子。
@DhavalMarthak，如果您注释掉 para.innerHTML += "cccc";，那么它就可以工作。你知道这是为什么吗？
我和@MikeMarks 有同样的问题
一个更强的提示是para.innerHTML += "cccc" 实际上是para.innerHTML = para.innerHTML + "cccc" 的简写。如果您在尝试更改之前查看para.innerHTML，您可能会弄清楚为什么该行会丢弃您的事件处理程序。【参考方案2】：
简短的回答，我得到的错误是Uncaught ReferenceError: spa is not defined，所以你需要先定义spa。
【讨论】：
已更正但仍然无效 是的，他的问题是它为什么不起作用。不知道为什么投反对票。 @ZachSpencer，你真的不知道他的意思是bspan吗？我不知道，我看到了你所看到的并立即知道这就是他的意思，但如果你没有，你知道，这就解释了你的答案。
@Mike 为什么需要散列？为什么我应该假设 spa 是一个错字？你需要放手迈克，这是百万分之一的答案。
@ZachSpencer - 它需要被讨论出来，因为如果你明知理解（或至少有一个不错的想法）他的真正意思，但你把这个作为答案只是为了搞笑，这并不完全是回答他的问题，虽然可以肯定，但从技术上讲，这是一个答案 - 它只是因为你没有真正注意他的问题，或者你只是想成为一个聪明的驴子。不需要天才就能明白他的意思，而这个答案并不是最想得到的。在发布这样的答案之前了解问题的根源。以上是关于为啥onclick处理程序在javascript中与innerHTML一起使用时不起作用[重复]的主要内容，如果未能解决你的问题，请参考以下文章
如何在 onClick 处理程序内的 JavaScript 代码中转义字符串？
为啥在 onclick 的值中使用任何其他词代替“javascript”时浏览器不会抛出错误？
为啥我不能使用 onClick 在 jQuery $(document).ready 函数中执行函数？