我正在尝试在 HTML 中创建 4 个按钮，它们调用以下函数，例如加法、减法、乘法、除法

Question

我是 JavaScript 新手，我对自己做错了什么感到有些困惑。对于这个作业，我需要在 HTML 中创建 4 个按钮，它们调用以下函数，例如加、减、乘和除。我想提示用户输入两个数字，然后它会计算它。

我想出了如何制作一个添加按钮，但由于某种原因，我无法为 - * / 创建其他按钮。我也不确定为什么它不跟踪减法按钮等的计算。我有点困惑如何在一个程序中创建多个功能和按钮。

function add() {

  var num1, num2, num3;

  numAdd1 = parseInt(prompt("Enter First Number:"));
  numAdd2 = parseInt(prompt("Enter Second Number:"));
  numAdd3 = numAdd1 + numAdd2



  resultAdd = "Result is " + String(numAdd3)
  //document.write(numAdd3 + "<br>")


  document.getElementById("result").innerHTML = resultAdd;

}

function sub() {

  var sub1, sub2, sub3;


  sub1 = parseInt(prompt("Enter First Number:"));
  sub2 = parseInt(prompt("Enter Second Number:"));
  sub3 = sub1 - sub2



  result2 = "result is : " + String(numSub3)
  //document.write(Sub3 + "<br>")


  document.getElementById("result2").innerHTML = result2;

}

<button onclick="add()">Press to Add</button>
<p id="result">Result:</p>

<button onclick="sub()">Press to Subtract</button>
<p id="result2">Result:</p>

<button onclick="Multiply()">Press to Multiply</button>
<p id="result">Result:</p>

<button onclick="Divide()">Press to Divide</button>
<p id="result2">Result:</p>

Answer 1

你打错字了。在result2 变量“赋值”的末尾（意思是设置变量的值），而你为变量使用了错误的名称。 numSub3 应该是 sub3。

result2 = "result is : " + String(sub3);

Answer 2

欢迎您，祝您作业顺利。好的开始！

我建议您使用input 元素作为您的数字输入，正如我在这个部分示例中所展示的那样。此外，请务必确保变量命名和一般代码布局的一致性。越早养成这些习惯越好。

并挑战自己添加一些花里胡哨的东西！

function run(operator) {
  const values = getValues();
  const result = calculate(values.left, values.right, operator);
  writeResult(result);
}

function calculate(left, right, operator) {

  if (operator === '+') {
    return left + right;
  }
  if (operator === '-') {
    return left - right;
  }
  /* 
  add rest of operations...
  */
  throw Error('Invalid operator passed in');
}

function getValues() {
  return {
    left: +document.getElementById('left').value,
    right: +document.getElementById('right').value,
  }
}

function writeResult(result) {
  document.getElementById('result').innerText = result;
}

<input type="number" id="left" />
<input type="number" id="right" />
<br/>
<button onclick="run('+')">Add</button>
<button onclick="run('-')">Subtract</button> ...more buttons
<div id="result"></div>