事件侦听器将在元素更改后停止处理该元素（仅限 JavaScript）

Question

请检查以下可执行示例代码...

 var inputform = document.getElementById('input-form'); var form = document.getElementById('message'); var input = document.getElementById('usermsg'); function change(value) { const form =` <form name="message" action="" id="message"> <textarea name="usermsg" id="usermsg"></textarea> </form>`; const div = ` <div id="message"> <div id="usermsg"></div> </div>`; var content = value == "div" ? div : form; inputform.innerHTML = content; } usermsg.addEventListener('keypress', function(e) { if (e.which == 13 && !e.shiftKey && input.value) { input.value = ''; } });

 <div id="input-form"> <form name="message" action="" id="message"> <textarea name="usermsg" id="usermsg"></textarea> </form> </div> <button onclick="change('div');">Press to div</button> <button onclick="change('form');">Press to form</button>

我正在使用此代码来检测用户何时在元素内单击

usermsg.addEventListener('keypress', function(e) {
  if (e.which == 13 && !e.shiftKey && input.value) {
    input.value = '';
  }
});

它应该是一个侦听器，但如果元素发生变化，它就会停止工作，甚至在之后，它又变回原来的形式。

如何防止它仅停止使用 javascript？

Answer 1

好的，这就是答案：

inputform.addEventListener('keypress', function(e) {
  const tgt = e.target;
  if (tgt.id==="usermsg") {
     if (e.which == 13 && !e.shiftKey && tgt.value) {
       tgt.value = '';
     }
  }
});

谢谢你们。