为了账号安全,请及时绑定邮箱和手机立即绑定

addEventListener 不适用于动态加载内容

addEventListener 不适用于动态加载内容

天涯尽头无女友 2021-09-30 15:15:58
我想动态加载按钮,每个按钮都加载了一个附加的 addEventListener 和一个随机生成的 id。按钮发出警报。问题:当我加载(通过单击添加按钮)新按钮时,只有第一个按钮附加了事件侦听器?这是我的代码:  <button id="button" type="button" >add</button>    <div id="demo"></div>function Pers45on() {di3=rngc(10,100001);var yu=document.getElementById('demo').innerHTML;document.getElementById('demo').innerHTML='<button id="'+di3+'" type="button" >newb</button>'+yu;document.getElementById(di3).addEventListener('click', al, false);}function al(){alert();}document.getElementById('button').addEventListener('click', function(){Pers45on();}, false);function rngc(A,B) {        var d = new Date(),n = d.getMilliseconds();  return 'ig'+Math.random().toString(36).replace(/[^a-z]+/g, '').substr(0,A)+Math.floor(Math.random() * (B))+n;}更新:我给出的示例代码与我的实际问题相同;我正在尝试将许多 HTML 元素作为字符串附加,并且使用 createElement 可以正常工作,但不是不实用的解决方案。我还有一个有效的解决方案:objar=[];function Pers45on() {di3=rngc(10,100001);objar.push(di3);var yu=document.getElementById('demo').innerHTML;document.getElementById('demo').innerHTML='<button id="'+di3+'" type="button" >'+di3+'</button>'+yu;document.getElementById(di3).addEventListener('click', al, false); for(i=0; i<=objar.length;i++){document.getElementById(objar[i]).addEventListener('click', al, false);} }但我不喜欢 for 循环,我试图理解为什么会发生这种情况并寻找任何令人信服的解决方案。
查看完整描述

2 回答

  • 2 回答
  • 0 关注
  • 202 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信