在 JavaScript 中为新添加的元素添加 onclick 事件

IT技术 javascript events new-operator element add
2021-02-04 00:52:55

我一直在尝试将 onclick 事件添加到我用 JavaScript 添加的新元素中。

问题是当我检查 document.body.innerHTML 时，我实际上可以看到 onclick=alert('blah') 被添加到新元素中。

但是当我单击该元素时，我没有看到警报框在工作。事实上，任何与 JavaScript 相关的东西都不起作用。

这是我用来添加新元素的内容：

function add_img() { 
  var elemm = document.createElement('rvml:image'); 
  elemm.src = 'blah.png';
  elemm.className = 'rvml';
  elemm.onclick = "alert('blah')";
  document.body.appendChild(elemm);
  elemm.id = "gogo";
  elemm.style.position='absolute';
  elemm.style.width=55;
  elemm.style.height=55;
  elemm.style.top=200;
  elemm.style.left=300;
  elemm.style.rotation=200; 
}

这是我调用此函数的方式：

<button onclick=add_img()>add image</button>

现在图像在浏览器中完美绘制。但是当我单击图像时，我没有收到该警报。

6个回答

.onclick应该设置为函数而不是字符串。尝试

elemm.onclick = function() { alert('blah'); };

反而。

您还可以设置属性：

elem.setAttribute("onclick","alert('blah');");
有趣的做法！
2021-03-18 00:52:55
如果只想插入特定属性及其各自的值作为字符串，则此特定方法“setAttribute()”很有用。
2021-04-12 00:52:55

不确定，但请尝试：

elemm.addEventListener('click', function(){ alert('blah');}, false);
即使.addEventListener第二个参数仍然需要是一个函数而不是一个字符串。
2021-03-31 00:52:55
使用 jQuery 我不记得这个了 ;) 谢谢
2021-04-01 00:52:55

您不能按字符串分配事件。使用那个：

elemm.onclick = function(){ alert('blah'); };

简短回答：您想将处理程序设置为一个函数：

elemm.onclick = function() { alert('blah'); };

稍微长一点的答案：你必须多写几行代码才能让它在浏览器中一致地工作。

事实是，即使可能在一组常见浏览器中解决特定问题的稍长代码仍然会带来其自身的问题。因此，如果您不关心跨浏览器支持，请选择完全简短的支持。如果您关心它并且绝对只想让这件事起作用，请结合使用addEventListener和attachEvent。如果您希望能够在整个代码中广泛地创建对象并添加和删除事件侦听器，并且希望它可以跨浏览器工作，那么您肯定希望将该职责委托给一个库，例如 jQuery。

我只需要这个用于 Internet Explorer .. 短的就像魅力一样。感谢您提供详细的解决方案
2021-04-10 00:52:55
其它你可能感兴趣的问题
上一篇如何在没有require语句的情况下使用webpack加载目录中的所有文件 下一篇AngularJS 中循环依赖和 OOP 的问题