javascript - Enter 键在单击按钮时不起作用

标签 javascript html css bootstrap-4

大家好,我是 JavaScript 和编程的初学者。 我刚刚使用 html、css 和 javascript 进行了实时对话。 我无法访问按钮标签中的回车键。

<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>

最佳答案

<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>

关于javascript - Enter 键在单击按钮时不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49314470/

相关文章:

php - 如果连续少于 3 个,则动态将 bootstrap 更改为中心

html - 如何修复 svg 背景的错误?

css - 具有 3 个背景的容器,绝对 div 为父级的 100% 高度

javascript - Vue.js 与 vue Material ;滚动

Javascript:Promise.all 似乎没有解决

javascript - Chrome 渲染错误、Slick.js、Flash 动画

javascript - select2 设置多个选定值

html - 宽度和高度均具有纵横比的响应式 div

javascript - 在 li 上切换下拉菜单,但防止在 ul 上切换点击

html - 什么时候应用这些 CSS 属性 : ul#nav li. current a, ul#nav li :hover a?