Question

我是HTML和JavaScript的新手，我正在尝试做家庭作业。

有一个表单，其中包含用户输入数字的两个字段和一个按钮。按下按钮时，应显示两个数字中的最大值。

实际上，输出是NaN，但我不知道为什么。我已经通过chrome调试器运行它，并且在行var1 = parseInt(var1);处，var1具有值NaN。下一行也是如此。

如果我用var1 = parseInt("6");之类的东西替换每一行，这不会发生，一切都按预期行事（尽管显然没有按照我的要求行事）。

知道我做错了吗？

<html>
<head>
  <title> Question 2 </title>
  <script>
  function larger(var1,var2) {
    var1 = parseInt(var1);
    var2 = parseInt(var2);
    var max = var1>var2 ? var1 : var2;
    return max;
    }
    </script>
</head>
<body>
    <form>
        <label>First number:</label> <input type="text" name="num1"/><br/>
        <label>Second number:</label> <input type="text" name="num2"/><br/>
        <input type="button" value="Compute" onclick="myResult.value=larger(num1,num2)"/>
        <input type="text" name="result" id="myResult"/>
    </form>
</body>
</html>

Answer 1

<body>
    <form>
        <label>First number:</label> <input type="text" name="num1"/><br/>
        <label>Second number:</label> <input type="text" name="num2"/><br/>
        <input type="button" value="Compute" onclick="myResult.value=larger()"/>
        <input type="text" name="result" id="myResult"/>
    </form>
</body>

function larger() {    
    var1 = parseInt(document.getElementsByName('num1'));
    var2 = parseInt(document.getElementsByName('num2'));
    var max = var1>var2 ? var1 : var2;
    return max;
}

Answer 2

您的函数无法从HTML中获取值。您无需参数化您的功能。您可以读取函数内的值，如：

    var1 = document.getElementById('someId');

并在输入字段中添加id =“someId”-Tag。

Answer 3

你在这里做错了：因为你调用了这样的函数：onclick="myResult.value=larger(num1,num2)"

这是不正确的，因为如果您希望获得num1和num2的价值，则需要使用javascript方法document.getElementsByName。

在您的情况下，您可以使用：

var num1Value = document.getElementsByName(num1);
var num2Value = document.getElementsByName(num2);

document.getElementsByName

第二件事，你使用parseInt()方法来解析字符串并返回一个整数。

ParseInt()

Answer 4

您可以按如下方式更改功能

function larger(var1,var2) {
    var1 = document.getElementsByName("num1");
    var2 = document.getElementsByName("num2");
    var max = var1>var2 ? var1 : var2;
    return max;
    }

Answer 5

因为getElementsByName（）返回节点数组。因此，您必须通过以下方法获取文本框的值：

<body>
     <form>
         <label>First number:</label> <input type="text" name="num1"/><br/>
         <label>Second number:</label> <input type="text" name="num2"/><br/>
         <input type="button" value="Compute" onclick="myResult.value=larger()"/>
         <input type="text" name="result" id="myResult"/>
     </form>
</body>
<script>
     function larger() {
         var1 = parseInt(document.getElementsByName("num1")[0].value);
         var2 = parseInt(document.getElementsByName("num2")[0].value);
         var max = var1>var2 ? var1 : var2;
         return max;
     }
</script>

在按钮点击上找到最多两个数字

5 个答案: