Question

我似乎无法理解为什么我无法让.toFixed()在我的代码中工作。我尝试过不同的变化但缺少某些东西。

运行代码时出现以下错误。

未捕获TypeError：document.getElementById（...）。value.toFixed不是功能

我的代码：

<input type="number" id="num1">
<p>+</p>
<input type="number" id="num2">
<p>=</p>
<p id="result"></p>
<br>
<button id="submit" onclick="calculate()">Calculate</button>

<script>
  function calculate(){
    const a = document.getElementById("num1").value;
    const b = document.getElementById("num2").value;

    let finalAnswer = a.toFixed(2) + b.toFixed(2);
    document.getElementById("result").innerHTML = finalAnswer;
    console.log(a);
    }
</script>

Answer 1

.toFixed（）是一种数字方法。从输入中获取值时，它是一个字符串。因此，您必须将其转换为数字。您可以转换为数字： Number() 所以，你的代码应该是这样的：

const a = Number（document.getElementById（＆＃34; num1＆＃34;）。value）; const b = Number（document.getElementById（＆＃34; num2＆＃34;）。value）;

Answer 2

那是因为您的输入被评估为字符串而不是数字，这是我解决它的多种方式之一：

const a = document.getElementById("num1").value - 0;
const b = document.getElementById("num2").value - 0;

Answer 3

toFixed在Number中定义为can see in the documentation，因此您必须先将输入值转换为数字才能使用它。

为此，您可以使用Number构造函数将文本传递给它：

let myNumber = Number(someString);

之后你可以用toFixed()输出结果，它会给你一个string小数点后面的数字和你传给它的数字：

console.log(myNumber.toFixed(2));

考虑到所有这些因素，您可以将代码更改为：

＆＃13;

function calculate() {
  const a = document.getElementById("num1").value;
  const b = document.getElementById("num2").value;

  //Convert both inputs to Number's before adding them
  let finalAnswer = Number(a) + Number(b); 

  //toFixed only here when you need to output it
  document.getElementById("result").innerHTML = finalAnswer.toFixed(2); 
  console.log(a);
}

＆＃13;

<input type="number" id="num1">
<p>+</p>
<input type="number" id="num2">
<p>=</p>
<p id="result"></p>
<br>
<button id="submit" onclick="calculate()">Calculate</button>

＆＃13;

如何从输入字段使用.toFixed（）

3 个答案: