【发布时间】:2018-08-05 09:38:12
【问题描述】:
目前我必须在一个简单的网站上工作,该网站从用户那里获取三个值,将它们相加并提供平均值。讲师帮我把它放在一起,但今晚完成它我无法得到正确的平均值。
这是我的 HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="description" content="Demonstrates some logic errors" />
<meta name="keywords" content="HTML, average, errors" />
<meta name="author" content="997993X" />
<title>Average numbers</title>
<script src="badaverage.js"></script>
</head>
<body>
<h1>Average numbers</h1>
<p>Click the button to enter a series of numbers to average</p>
<button id="enter">Enter your first number</button>
<p><span id="numberList"></span></p>
<button id="calculate">Calculate the average</button>
<p><span id="result"></span></p>
</body>
</html>
这是我的 JS:
/*
JavaScript used with 'average.html'
*/
"use strict";
//Global variables accessible to all functions
var numbers = []; //create an empty array
var enterButton = null; //global variables must be initialised
var calculateButton = null;
/* Get a number from the prompt
* If a valid number add to array, if not give error message to user
* Display the updated array of numbers on the web page
* Make the Calculate button visible
*/
function enterNumber(){
var number = prompt("Enter your number");
var number = Number(number); // No idea what thi does, added by prof
if (isFinite(number)) { // test what is entered is a number
numbers.push(number); //add the number entered to the end of the array
}
else{
alert("Please enter a valid number");
}
document.getElementById("numberList").innerHTML = "The numbers you have entered so far are: " + numbers; //diplay a list of number entered
enterButton.textContent = "Enter your next number"; //change the label on the Enter Button
calculateButton.style.visibility = "visible"; //show the button - uses the CSS property of the elenment
}
/* Calculate the sum and average of the array of number
* Display the results on the web page
*/
function calculateAverage(){
var average = 0;
var total = 0;
for (var i = 1 ; i < numbers.length; i++){
total = numbers[i]; //add each number in the array to the cumulative total
}
average = total/i;
document.getElementById("result").innerHTML = "The total of your numbers is " + total + " and their average is " + average;
}
function init(){
enterButton = document.getElementById("enter");
calculateButton = document.getElementById("calculate");
calculateButton.style.visibility = "hidden"; //hide the Calculate button until some numbers are entered
enterButton.onclick = enterNumber;
calculateButton.onclick = calculateAverage;
}
window.onload = init;
我已经使用常用的 Firefox 调试器来查找错误,但已经很晚了,但我很确定我在 for 循环的初始化语句期间与 JS 的第 35 行发生了冲突。 "numbers[i]" 在循环运行 3 次后变为未定义,导致平均值为 NaN。
很抱歉这个菜鸟问题,我觉得我在盯着它看,如果能帮我把这个学生送去睡觉,我们将不胜感激。
【问题讨论】:
-
我猜你想做
total += numbers[i];和var i = 0,否则你会跳过第一个元素 -
是的,。这就是解决方案:) @JonasW 之前没有阅读您的评论,否则我不会发布作为答案。
-
@nandita 这是一种常见的回答方式,尽管其他人已经指出了解决方案......所以请随时取消删除您的回答。
标签: javascript html arrays for-loop