Javascript表单不返回值_Javascript

Javascript表单不返回值

javascript

Javascript表单不返回值,javascript,Javascript,它看起来不错，但没有返回任何值。有什么想法吗 <!doctype html> <html> <head> <meta charset="UTF-8"> <title>Untitled Document</title> <style type="text/css"> .out { height: 22px; width: 100px; border:solid 1px;

它看起来不错，但没有返回任何值。有什么想法吗

    <!doctype html>
<html>
<head>

<meta charset="UTF-8">
<title>Untitled Document</title>
<style type="text/css">
.out {
    height: 22px;
    width: 100px;
    border:solid 1px;
    margin: 4px;
    padding: 3px;
    line-height: 22px;
}
form input {
    display: block;
}
</style>
</head>

<body>
<form>Number 1
    <input type="text" id="firstNumber">Number 2
    <input type="text" id="secondNumber">Number 3
    <input type="text" id="thirdNumber">
    <input type="button" value="Add Total" onclick="addIt()">
    <div class="out" id="Total"></div>
    <input type="button" value="Multiply Total" onclick="multiply()">
    <div class="out" id="multiplyresult"></div>
    <input type="button" value="Ave Total" onclick="averesult()">
    <div class="out" id="averesult"></div>
</form>

</body>
</html>
<script type="text/javascript">
var result = getId('Total'),
    multiplyresult = getId('multiplyresult'),
    n1, n2, n3;

function getValues() {
    n1 = getId('firstNumber').value, n2 = getId('secondNumber').value, n3 = getId('thirdNumber').value;
}
console.log((n1) * (n2) * (n3));
window.addIt = function() {
    getValues();
    result.innerText = (+n1) + (+n2) + (+n3);
};
window.multiply = function() {
    getValues();
    multiplyresult.innerText = (n1) * (n2) * (n3);
};
window.average = function() {
    getValues();
    averesult.innerText = (n1) + (n2) + (n3) / 3;
};

function getId(x) {
    return document.getElementById(x);
}
</script>


无标题文件
.出去{
高度：22px；
宽度：100px；
边框：实心1px；
保证金：4倍；
填充：3倍；
线高：22px；
}
表单输入{
显示：块；
}
第一
二号
三号
var result=getId（'Total'），
multiplyresult=getId（'multiplyresult'），
n1，n2，n3；
函数getValues（）{
n1=getId（'firstNumber'）。值，n2=getId（'secondNumber'）。值，n3=getId（'thirdNumber'）。值；
}
控制台日志（（n1）*（n2）*（n3））；
window.addIt=函数（）{
getValues（）；
result.innerText=（+n1）+（+n2）+（+n3）；
};
window.multiply=函数（）{
getValues（）；
multiplyresult.innerText=（n1）*（n2）*（n3）；
};
window.average=函数（）{
getValues（）；
averesult.innerText=（n1）+（n2）+（n3）/3；
};
函数getId（x）{
返回文档.getElementById（x）；
}

我还试图找出如何返回三个数字的平均值。但由于我是一个完全的新手，我不知道如何做到这一点。加法和乘法函数现在正在工作，但平均值不起作用。

提前感谢。

问题是，在加载所有元素之前，页面一加载就运行脚本。因此，您试图访问的元素还不存在，并且在页面加载完成之前不存在。这可以通过两种方法之一解决。第一种方法是将其包装在

窗口中。onload

，第二种方法是将

标记移动到


的末尾。平均值必须这样计算：
window.average = function() {
    getValues();
    averesult.innerText = ((n1) + (n2) + (n3)) / 3; //Note brackets around n1->n3
};

您对averesult（）
的调用需要更改为average（）
您是否尝试在html之后添加脚本？还是使用？谢谢你，很好。你试图访问在脚本评估时不可用的html元素（节点）。尝试在div之后和之前添加console.log（getId（'multiplyresult'））
，并查看输出结果。将脚本移动到表单之后，因为如果这个答案对您有所帮助，那么onclick需要调用average（）
而不是averaresult（）
@user3109332，你可以通过接受/表决这个答案来帮助未来有类似问题的人。