Question

我正在学习并想知道是否有办法做到这一点，假设我有HTML输入字段：

<input type=text id="input">

附近我会有一个按钮：

<button id="equal">=</button>

我想在该文本字段中编写将评估语句的javaScript（如果它是像“2 + 3”“6/2”之类的等式），并用该等式的答案替换该语句。我尝试了什么：

 var equal = document.querySelector("#equal");
 var input = document.querySelector("#input");
 equal.addEventListener('click', function () {
 eval(input.value) += input.innerText;
 });

我已经只输入了可能的输入1234567890和/ * - + 如果有办法，我会非常欣赏答案和解释，刚刚开始使用javaScript，所以它对我来说仍然像一个黑暗的森林，但我确实希望能够更好地理解它。：）

Answer 1

您只需将eval(input.value) += input.innerText交换为input.value = eval(input.value)

即可

＆＃13;

var equal = document.querySelector("#equal");
var input = document.querySelector("#input");
equal.addEventListener('click', function() {
  input.value = eval(input.value);
});

＆＃13;

<input type=text id="input">
<button id="equal">=</button>

＆＃13;

此外，建议使用document.getElementById代替document.querySelector，但没有太大区别（主要是与旧浏览器的兼容性）。 Read more

Answer 2

您希望输入表达式的位置不同，而不是显示的地方：

<!DOCTYPE html>
<html>
<body>
  <button id="evaluate">Get answer</button>
  <input id="input" />
  <p id="result">waiting for answer...</p>
  <script>
    var evaluate = document.getElementById("evaluate");
    var input = document.getElementById("input");
    var result = document.getElementById("result");
    
    evaluate.addEventListener('click', function () {
      try {
        result.textContent = eval(input.value);
      }
      catch (error) {
        result.textContent = "waiting for answer...";
      }
    });
  </script>
</body>
</html>

Javascript eval（）输入字段和输出答案在同一个字段中

2 个答案: