为什么我的警报总是显示错误的信息？（添加）答案

【问题标题】：Why is my alert always showing the wrong information? (addition)为什么我的警报总是显示错误的信息？（添加）
【发布时间】：2014-02-16 01:11:10
【问题描述】：

我目前正在使用 HTML 和 Javascript 编写一些代码。我正在为自己构建一个迷你 Javascript 计算器，它可以使用 HTML 'GUI' 运行简单的加法 - 如果你这样做的话。代码如下。

<!DOCTYPE html>
<html lang="en">
<head>
<link href="stylesheet/calculator.css" type="text/css" rel="stylesheet" />
<script>
    function activeButton() {
        if (document.getElementById("radioAdd").checked === true) {
            var valueOne = Number(document.getElementById("number1".value));
            var valueTwo = Number(document.getElementById("number2".value));
            var result = valueOne + valueTwo;
        alert("Your Result Is " + result);
        }       
    }
</script>
</head>
<body>
<div id="wrapper">
        <div id="form-move">
            <form name = "calculator" id="calculator">
                <div id="numberInput">
                    <input type="number" name="inputNumber1" id="number1" placeholder="Type or Select Your First Number" />
                    <input type="number" name="inputNumber2" id="number2" placeholder="Type or Select Your Second Number" />
                </div>
                <div id="radio-input">
                        <span class="title">Operators:</span>
                    <input type="radio" name="radioInputAdd" id="radioAdd" value="Addition" />
                        <label for="radioAdd">Addition</label>
                    <input type="radio" name="radioInputAdd" id="radioDivision" value="Division" />
                        <label for="radioDivision">Division</label>
                    <input type="radio" name="radioInputAdd" id="radioMultiply" value="Multiplication" />
                        <label for="radioMultiply">Multiply</label>
                    <input type="radio" name="radioInputAdd" id="radioSubtract" value="Subtraction" />
                        <label for="radioSubtract">Subtract</label>
                </div>
                <div class="submit">
                    <input type="submit" value="Enter" id="submit" onclick="activeButton()" />
                </div>
            </form>
        </div>
</div>

页面中间有两个输入框，只接受数字。
在它们下面是四个单选按钮——加、除、乘和减。现在，您可以看到页面顶部包含的 javascript。

我遇到的问题是，当我运行页面并想要添加两个数字时，代码可以工作，但答案却是 0。我已经在 chrome 中对此进行了测试，这种情况一直都在发生。

有人可以帮忙吗？

【问题讨论】：

标签： javascript html alert radio

【解决方案1】：

问题在于您如何尝试从输入元素中获取值。在这段代码中：

var valueOne = Number(document.getElementById("number1".value));
var valueTwo = Number(document.getElementById("number2".value));

您试图从 字符串 "number1"（即undefined）获取value 属性，然后将其传递给document.getElementById，后者将返回null，并且然后将其传递给Number，它将返回0。

试试这个：

var valueOne = Number(document.getElementById("number1").value);
var valueTwo = Number(document.getElementById("number2").value);

【讨论】：

【解决方案2】：

试试这个：

var valueOne = Number(document.getElementById("number1").value);
var valueTwo = Number(document.getElementById("number2").value);

你把括号放错地方了。

【讨论】：

也谢谢你！非常感谢您的帮助！