事件监听器将在元素发生变化后停止工作(仅限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 = '';
}
}
});

谢谢大家。