使按键“单击”一个 html 按钮答案

【问题标题】：Make a keypress "click" an html button使按键“单击”一个 html 按钮
【发布时间】：2020-07-23 03:14:58
【问题描述】：

所以我正在制作一个简单的计算器。我已经使用 onclick 对其进行了编码：

document.querySelectorAll(".numbers").forEach((element) => {
  element.onclick = () => {
    inputNumbers(element);
  };
});

inputNumbers = (element) => {
  if (
    element.id === "decimalbtn" &&
    $display.innerText.includes(".") &&
    !equalPressed
  ) {
    $display.innerText = element.innerText;
// ....

html 看起来像这样：

<button id="4btn" class="numbers" value="4">4</button>

我想做的就是当我点击键盘上的“4”时，它会模拟点击 4 按钮。

我试过了

document.addEventListener("keydown", function (event) {
  if (event.key === "enter") {
    document.querySelector('*[data-op="equals"]').click();
  }
});

对于等号按钮，但由于某种原因它不起作用。如果我按 8 + 2 然后按 Enter，它会给我 22。我认为它不会触发 if 语句并中断。

有什么建议吗？想要保留原版 JS，我认为模拟 html 按钮点击比尝试在现有功能中实现按键更容易，但我全神贯注。

【问题讨论】：

if (event.key === "enter") { event.preventDefault(); ...
对不起，你建议我把这个放在哪里？就像我现在拥有的，但在查询选择器之前？ - 只是那样做，这并没有什么不同。

标签： javascript onclick click calculator keypress

【解决方案1】：

这是有效的：

 document.addEventListener("keydown", (e) => {
if (e.key == "." || (e.key >= 0 && e.key <= 9)) {
  event.preventDefault();
  document.getElementById(e.key + "btn").click();
} else if (e.key == "Enter" || e.key == "=") {
  event.preventDefault();
  document.getElementById("equalsignbtn").click();

我将 decimalbtn 更改为 .btn 以使用它。

【讨论】：