javascript - HTML/Javascript 键盘功能不起作用

Question

我正在为学校项目制作页面，并且正在尝试为密码系统制作键盘。但是，我不知道如何让钥匙工作。查找它，我发现了多个工作键盘，但是，我不知道我必须将其代码的哪些部分添加到我的页面才能使其工作。

以下代码目前是我附加到onclick每个按钮部分的代码：

    <script>
      function kpclick(){
        var current = document.getElementById("tbInput").value;
        var append = this.innerHTML;
        if (current.length < 4) {
          if (current=="0") {
            document.getElementById("tbInput").value = append;
          } else {
            document.getElementById("tbInput").value += append;
          }
        }
      }
    </script>

提到的“tbInput”是同一 div 中键盘下方的文本框，稍后将被隐藏并（希望）禁用。如果在禁用文本框时没有允许使用键盘的解决方案，我可能会将其移到键盘所在的 div 之外。

当我当前按下任何按钮时，什么都没有发生。这里发生了什么事？

标签： javascripthtml

Answer 1

我假设this是按钮上下文。你可以通过它onclick="kpclick(this)"。

function kpclick(target) {
  var current = document.getElementById("tbInput").value;
  var append = target.innerHTML;
  if (current.length < 4) {
    if (current == "0") {
      document.getElementById("tbInput").value = append;
    } else {
      document.getElementById("tbInput").value += append;
    }
  }
}

<button onclick="kpclick(this)">0</button>
<button onclick="kpclick(this)">1</button>
<input id="tbInput">