所以,正如你在我的代码中看到的,我点击的任何按钮都会被输出到控制台。我希望它显示在输入type=“textfield”中,我可能会错过一些逻辑,在这里我也可以计算两个数字。请记住,我是Javascript新手,这是我的第一个项目。
我需要在文本字段中显示总和。

const buttons = document.querySelectorAll("input[type=button]");
const length = buttons.length;
for (let i = 0; i < length; i++) {
  buttons[i].addEventListener("click", handle);
}

function handle(event) {
  const value = event.target.value;
  switch (value) {
    case "+":
      console.log("+ was clicked");
      break;
    case "-":
      console.log("- was clicked");
      break;
    case "*":
      console.log("+ was clicked");
      break;
    case "/":
      console.log("/ was clicked");
      break;
    default:
      //console.log("%s was clicked", value);
      var myInput = document.getElementById("equal");
  }
}

<!DOCTYPE html>
<html lang="en">

<head>
  <title>Dizzy Calculator</title>
</head>

<body bgcolor="#b3b3cc" text="white">
  <form name="calculator">
    <h1>Calculator</h1>
    <div class="num">
      <tr>
        <td>
          <input type="button" value="1">
          <input type="button" value="2">
          <input type="button" value="3">
          <input type="button" value="+">
        </td>
      </tr>
      <br>
      <tr>
        <td>
          <input type="button" value="4">
          <input type="button" value="5">
          <input type="button" value="6">
          <input type="button" value="-">
        </td>
      </tr>
      <br>
      <tr>
        <td>
          <input type="button" value="7">
          <input type="button" value="8">
          <input type="button" value="9">
          <input type="button" value="*">
        </td>
      </tr>
      <br>
      <tr>
        <td>
          <input type="button" value="/">
          <input type="button" value="0">
          <input type="reset" value="Reset">
        </td>
      </tr>
      <br>
      <input type="button" value="=" id="equal" onClick="document.calculator.ans.value=eval(document.calculator.ans.value)">
      <br>Solution is <input type="textfield" name="ans" value="">
    </div>
  </form>
</body>

</html>

最佳答案

首先我会在你的文本字段中添加一个ID。

<input id="textfield" type="text" name="ans" value="">

然后添加一些代码,将单击的数字追加到文本字段中。
default:
  //console.log("%s was clicked", value);
  var myInput = document.getElementById("equal");

  // add value of button to textfield
  document.getElementById("textfield").value += value;

你还必须添加代码来处理数学问题。试着使用上面的代码,如果你卡住了就发帖子。

09-17 04:50