[英]Event listener will stop working on an element after it changes (javascript only)
Please check the following executable example code ...请检查以下可执行示例代码...
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>
I'am using this code to detect when a user clicks inside the element我正在使用此代码来检测用户何时在元素内单击
usermsg.addEventListener('keypress', function(e) {
if (e.which == 13 && !e.shiftKey && input.value) {
input.value = '';
}
});
It's supposed to be a listener but it will stop working if the element changes and even after, it changes back to its original form.它应该是一个侦听器,但如果元素发生变化,它就会停止工作,甚至在之后,它又变回原来的形式。
How can I prevent it from stop working with javascript only?如何防止它仅停止使用 javascript?
Okay, this is the answer:好的,这就是答案:
inputform.addEventListener('keypress', function(e) {
const tgt = e.target;
if (tgt.id==="usermsg") {
if (e.which == 13 && !e.shiftKey && tgt.value) {
tgt.value = '';
}
}
});
Thank you guys.谢谢你们。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.