Question

您好我已经编写了一些代码，以便用户输入摄氏度值，并将程序转换为华氏度。我不确定为什么输出会在我尝试时显示NaN。

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title></title>
    <script type="text/javascript">
    var degFahren;
    var degCent;
    function input_onchange(degCent) {
      degFahren = parseInt((9 / 5) * degCent + 32);
      document.form1.output.value = degFahren;
    }
    </script>
  </head>
  <body>
    <form action="" name="form1" method="post">
        <h3>Type any degrees centigrade and convert it to Fahrenheit.</h3>
        <p>
          Degrees Centigrade:
          <input type="text" name="input" onchange="input_onchange()">
        </p>
        <p>
          Degrees Fahrenheit:
          <input type="text" name="output" readonly="readonly">
        </p>
    </form>
  </body>
</html>

Answer 1

这是因为您没有将值传递给input_onchange方法。像这样更改您的onchange属性;

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title></title>
    <script type="text/javascript">
    var degFahren;
    var degCent;
    function input_onchange(degCent) {
      degFahren = parseInt((9 / 5) * degCent + 32);
      document.form1.output.value = degFahren;
    }
    </script>
  </head>
  <body>
    <form action="" name="form1" method="post">
        <h3>Type any degrees centigrade and convert it to Fahrenheit.</h3>
        <p>
          Degrees Centigrade:
          <input type="text" name="input" onchange="input_onchange(this.value)">
        </p>
        <p>
          Degrees Fahrenheit:
          <input type="text" name="output" readonly="readonly">
        </p>
    </form>
  </body>
</html>

...在这里，this指的是元素本身（input）。

Answer 2

您应该将输入字段值传递给函数。

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title></title>
    <script type="text/javascript">
    var degFahren;
    var degCent;
    function input_onchange(degCent) {
      degFahren = parseInt((9 / 5) * degCent + 32);
      document.form1.output.value = degFahren;
    }
    </script>
  </head>
  <body>
    <form action="" name="form1" method="post">
        <h3>Type any degrees centigrade and convert it to Fahrenheit.</h3>
        <p>
          Degrees Centigrade:
          <input type="text" name="input" onchange="input_onchange(this.value)">
        </p>
        <p>
          Degrees Fahrenheit:
          <input type="text" name="output" readonly="readonly">
        </p>
    </form>
  </body>
</html>

Answer 3

更新了您的代码。

＆＃13;

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title></title>
    <script type="text/javascript">
    var degFahren;
    var degCent;
    function input_onchange(degCent) {
      degFahren = parseInt((9 / 5) * degCent + 32);
      console.log(degFahren);
      document.form1.output.value = degFahren;
    }
    </script>
  </head>
  <body>
    <form action="" name="form1" method="post">
        <h3>Type any degrees centigrade and convert it to Fahrenheit.</h3>
        <p>
          Degrees Centigrade:
          <input type="text" name="input" onchange="input_onchange(this.value)">
        </p>
        <p>
          Degrees Fahrenheit:
          <input type="text" name="output" readonly="readonly">
        </p>
    </form>
  </body>
</html>

＆＃13;

问题是你没有将任何参数传递给input_onchange()方法

Answer 4

您已在函数中请求了参数，但未向其传递值。我调整了你的代码......现在应该可以正常工作了：）

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title></title>
    <script type="text/javascript">
    var degFahren;
    var degCent;
    function input_onchange() {
      var degCent = document.getElementById("input-centigrade").value;
      degFahren = parseInt((9 / 5) * degCent + 32);
      document.form1.output.value = degFahren;
    }
    </script>
  </head>
  <body>
    <form action="" name="form1" method="post">
        <h3>Type any degrees centigrade and convert it to Fahrenheit.</h3>
        <p>
          Degrees Centigrade:
          <input type="text" name="input" id="input-centigrade" onchange="input_onchange()">
        </p>
        <p>
          Degrees Fahrenheit:
          <input type="text" name="output" readonly="readonly">
        </p>
    </form>
  </body>
</html>

Javascript输出显示NaN时不应该

4 个答案: