Question

在以下位置放置函数时，不会发生“点击”事件：

<pre>
 <body> 
   <section class="page">
      <label for="name">Nome: </label>
      <input type="text" name="nome">
      <input type="button" value="Adicionar na lista">
   </section>

   <script>
      var autores = [{nome:'CCarlos'},{nome:'Daniel'}];
      var botao = document.querySelector('input[type=button]');
      botao.addEventListener('click',aviso);
      imprimir();
      function aviso(){
         alert('aasf');
      }

      function imprimir(){
         var pagina = document.querySelector('.page');
         for(i in autores){
           enter code herepagina.innerHTML += `<p>${autores[i].nome}</p>`;
         }
      }   
   </script>
</body>

而当我删除时，我的工作正常，没有想法为什么会发生

Answer 1

您正在使用innerHTML +=更改html，这会破坏pagina中的所有内容并重新创建所有内容。这意味着您的事件侦听器会再见。

Answer 2

这是您的实际代码吗？您有此实际行还是仅仅是复制/粘贴错误？

enter code herepagina.innerHTML += `<p>${autores[i].nome}</p>`;

如果是这样，我想您在浏览器的控制台上有一些语法错误。赞一下

pagina.innerHTML += `<p>${autores[i].nome}</p>`;

如果是复制/粘贴错误，请检查浏览器控制台是否有错误

EventListener在某些功能之前不起作用

2 个答案: