如何解决当我向元素添加 eventHandler 或 onClick 时,“它在哪里”?
如果我动态创建一个元素,然后向它添加一个 onclick="function()",为什么不将该代码物理添加到元素中,就像向它添加类一样?
询问是因为我试图在玩家之间来回传递棋盘游戏。我可以通过 AJAX 将容器元素的 innerHTML 发送给下一个玩家,实体游戏将为他们加载 - 但是动态创建的片段上的任何事件处理程序都不再存在。
我是否必须创建一个函数来将它们放回原处?我认为这不会太难,但是如果有一种方法可以在添加到元素时将 onclick 代码写入 html 页面,以便它传入 innerHTML 中,那会容易得多。
解决方法
您可以像目前一样通过 AJAX 传递 innerHTML
,但使用 onclick
容易受到 XSS 攻击,除非您进行某种 JS 混淆处理。
使用点击处理程序为两个播放器共享通用 Javascript 比混淆更容易。像这样:
// Assign an ID for every button,and handle each event separately.
const buttonElement = document.querySelector('#btnOne');
// This is the equivalent of `onclick`
buttonElement.addEventListener('click',function (event) {
alert('Element clicked through function!');
});
,
动态创建元素,添加事件需要使用事件委托。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。