0

该程序应执行以下操作： 用户应在右侧的输入字段中输入数字并单击计算。该值将被推送到数组中。这将进行 X 次。此时 X 被硬编码为 5 但这不是问题。

问题是数组中最后一个数被压入后，会计算出数组的总和并放到网页上。可视化不是问题，我很确定计算是正确的。我认为问题在于如何在数组中读取输入或 inputet。不过，我可能错了。

最后一件事，计算所有内容的函数是 compute1。编辑：实际错误：Uncaught TypeError: Cannot read property 'value' of null

这是整个源代码：

<!DOCTYPE HTML>
<head>
<title>Asd</title>
    <style>
        .btn{
            width : 30px;
        }
    .btn2{
            width : 100px;
            height : 40px;
        }
    </style>
</head>
<body>
<center>    
    <table>
        <tr>
            <td>Number of elements:</td><td><input type="number" id="textField" class="btn"></input></td>
            <td>Please enter a number.</td> <td><input type="number" id="textFiledInp" class="btn"></input></td>        
        </tr>
    </table>
    <button class="btn2" onclick="compute1()" >compute</button>
    <p id="output"></p>
</center>
</body>
<script>
//var eleNum = parseInt(document.getElementById("textField"));
var eleNum = 5;
var arr = new Array;
function compute1()
{
    console.log("hi");
    if(eleNum > 0)
    {
        eleNum--;
        arr.push(parseInt(document.getElementById("textFieldInp").value));
        console.log(arr[arr.length-1]);
    }
    else{
        var sum = 0;
        for(var i = 0; i < arr.size; i++)
        {
            sum+= arr[i];
        }
        document.getElementById("output").innerHTML = sum;
    }
}
</script>
4

4 回答 4

2

id您的元素中有错字：

id="textFiledInp"

...应该：

id="textFieldInp"

否则getElementById()找不到元素并返回null，因此您引用的错误消息。

并且您的for循环正在尝试使用arr.size，但应该是arr.length.

预设eleNum似乎5有点奇怪，但我并不完全清楚你想在那里做什么，所以我不知道有什么建议。我怀疑您只需要在函数中移动注释掉的行并添加.value（并取消注释）：

eleNum = parseInt(document.getElementById("textField").value, 10);

而且，不要parseInt()在没有在第二个参数中指定基数的情况下使用。这对于用户输入的数据尤为重要。（因为否则浏览器可能会将带有前导 0 的值解释为八进制，而将前导 0x 解释为十六进制。）

于 2013-06-13T12:50:24.813 回答
1

您输入的 ID 错误：

<td>Please enter a number.</td> <td><input type="number" **id="textFiledInp"** class="btn"></input></td>

并且您尝试获取 id 为“textFieldInp”的元素：

document.getElementById("textFieldInp").value);

更改id="textFiledInp"为id="textFieldInp"它应该可以工作。

并且size不是 javascript 数组的正确属性。您应该length在循环中使用属性。

如果你想推入arr你声明的数字数量，你应该写这样的东西（我不知道这是否是你想要的）：

    function compute1()
{
    console.log("hi");
    if(eleNum > 0)
    {
        eleNum--;
        arr.push(parseInt(document.getElementById("textFieldInp").value));
        console.log(arr[arr.length-1]);
    }
    else{
        var sum = 0;
        for(var i = 0; i < arr.length; i++)
        {
            sum+= arr[i];
        }
        document.getElementById("output").innerHTML = sum;
    }
}
于 2013-06-13T12:48:25.480 回答
1

修复 HTML 中的拼写错误后，您应该将代码更改为：

var eleNum = 5;
var arr = []; //see explanation

function compute1(value) {
    console.log("hi");
    if (eleNum > 0) {
        eleNum--;
        arr.push(parseInt(document.getElementById("textFieldInp").value || 0, 10)); // see explanation
        console.log(arr[arr.length - 1]);
    } else {
        var sum = 0;
        for (var i = 0; i < arr.length; i++) {
            sum += arr[i];
        }
        document.getElementById("output").innerHTML = sum;
    }
}

您正在使用新数组；而不是 new Array()，更好的方法是使用括号表示法。或者，在您的情况下，您可以根据用户（使用输入）给出的长度定义一个数组，甚至可以使用您的元素数量。会的new Array(eleNum)。

为什么|| 0？因为如果输入不是由用户定义的（值为空），那么它的总和为 0，否则你将得到 NaN；记得在 中指定基数parseInt，请参阅 nnnnnn 的答案。

看看这个的工作小提琴。

于 2013-06-13T12:52:09.207 回答
0

据我所知，您的计算是正确的，但是您缺少括号console.log(arr[arr.length-1)

它应该是：

        console.log(arr[arr.length-1]);
于 2013-06-13T12:46:43.193 回答