[英]Enter key is not working on button click
嗨,我是javascript和编程的初学者。 我只是使用html,css和javascript进行了实时对话。 我无法访问button标记中的Enter键。
<script>
function typo(){
var currentText = document.getElementById("demo").innerHTML;
enterkey();
var x = '<p class=chatbox>' + document.getElementById("myText").value + '</p>';
document.getElementById("myText").value = "";
var y = document.getElementById("demo").innerHTML = currentText + x;
}
function enterkey() {
var input = document.getElementById("myText");
input.addEventListener("keyup", function(event) {
event.preventDefault();
if (event.keyCode === 13) {
document.getElementById("btn-chat").click();
}
});
}
</script>
<p id="demo"></p>
<input type="text" id="myText" value="">
<button onclick="typo()" class="btn btn-warning btn-sm" id="btn-chat">Send</button>
您的函数enterkey()被调用。 我在功能启动时输入了警报,以检查其是否正常运行。 而且令人警觉。 也许您试图通过enterkey()实现的功能无法正常工作。 您需要检查一下。
<script> function typo(){ var currentText = document.getElementById("demo").innerHTML; enterkey(); var x = '<p class=chatbox>' + document.getElementById("myText").value + '</p>'; document.getElementById("myText").value = ""; var y = document.getElementById("demo").innerHTML = currentText + x; } function enterkey() { alert("check here"); var input = document.getElementById("myText"); input.addEventListener("keyup", function(event) { event.preventDefault(); if (event.keyCode === 13) { document.getElementById("btn-chat").click(); } }); } </script> <p id="demo"></p> <input type="text" id="myText" value=""> <button onclick="typo()" class="btn btn-warning btn-sm" id="btn-chat">Send</button>
谢谢
仅在您至少单击一次发送后,Enter键才起作用。 而且,每次单击发送按钮时,都不应将新的keyup
事件绑定到文本字段。 您可以改为这样做
<p id="demo"></p> <input type="text" id="myText" value=""> <button onclick="typo()" class="btn btn-warning btn-sm" id="btn-chat">Send</button> <script> function typo(){ var currentText = document.getElementById("demo").innerHTML; //enterkey(); var x = '<p class=chatbox>' + document.getElementById("myText").value + '</p>'; document.getElementById("myText").value = ""; var y = document.getElementById("demo").innerHTML = currentText + x; } // function enterkey() { var input = document.getElementById("myText"); input.addEventListener("keyup", function(event) { event.preventDefault(); if (event.keyCode === 13) { document.getElementById("btn-chat").click(); } }); //} </script>
在这里,我将脚本放置在HTML元素下面,以确保document.getElementById("myText")
返回已加载的输入,并在此之后绑定keyup
事件。
<p id="demo"></p> <input type="text" id="myText" value=""> <button onclick="typo()" class="btn btn-warning btn-sm" id="btn-chat">Send</button> <script> function typo(){ var currentText = document.getElementById("demo").innerHTML; var x = '<p class=chatbox>' + document.getElementById("myText").value + '</p>'; document.getElementById("myText").value = ""; var y = document.getElementById("demo").innerHTML = currentText + x; } var input = document.getElementById("myText"); input.addEventListener("keyup", function(event) { event.preventDefault(); if (event.keyCode === 13) { document.getElementById("btn-chat").click(); } }); </script>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.