我是这方面的初学者。我有一个网页设计作业(使用 Javascript 和 HTML5)，要求我使用 do while 循环来提示用户输入月份以及该月份采取的步数。这应该在我的 HTML 中动态填充一个列表，以便网站应该显示两列，其中包含输入的值。例如:
输入的步骤:
月份:步骤:
5月15000
20000年6月
7月25000
...等等...
总步数:60000
我的代码无法运行。
编辑:当前的问题是它似乎陷入了无限循环。 “完成”不会停止提示框，并且网站上不会填充任何内容。
有人能解释一下吗？预先感谢您!
这是我的代码:
<script type = "text/javascript">
function getSteps()
{
var months = new Array();
var steps = new Array();
var m = 0;
var s = 0;
var stepTotal = 0;
do{
months[m] = prompt("Enter a month or enter 'done' when finished:");
document.getElementById("mlog").innerHTML = months[m] + "<br>";
steps[s] = prompt("How many steps did you take?");
document.getElementById("slog").innerHTML = steps[s] + "<br>";
steps[s] = parseInt(steps[s]);
stepTotal += steps[s];
m++;
s++;
}while(months[m] != "done");
document.getElementById("totalS").innerHTML = "Total Steps: " + stepTotal;
}
</script><!DOCTYPE html>
<html lang="en">
<head>
<title>Monthly Steps Page</title>
<meta charset="utf-8">
</head>
<body>
<header>
<h1>Count your steps!</h1>
</header>
<section>
<h2>Click on the buttons below to enter the number of steps taken every month.</h2>
<button onclick="getSteps();">Steps Log</button><br><br>
<p>Steps Entered:</p>
<p>Month<br>
<span id="mlog"> </span></p>
<p>Steps<br>
<span id="slog"> </span></p>
<p>Total Steps: <span id="totalS"> </span></p>
</section>
</body>
</html>最佳答案
您在执行m++之后测试months[m]，因此应该有months[m-1].
最好将其移到循环之外。
function getSteps() {
var months = new Array();
var steps = new Array();
var m = 0;
var s = 0;
var stepTotal = 0;
var month = prompt("Enter a month or enter 'done' when finished:");
while (month && month != 'done') //pressed [cancel], empty or "done"
{
months.push(month); //months[m] = month;
//document.getElementById("mlog").innerHTML += months[m] + "<br>";
var step /*steps[s]*/ = parseInt(prompt("How many steps did you take?")) || 0; //0 replaces NaN
//document.getElementById("slog").innerHTML += steps[s] + "<br>";
document.getElementById("tablelog").innerHTML += "<tr><td>" + month + "</td><td>" + step + "</td></tr>";
steps.push(step); //steps[s] = parseInt(steps[s]);
stepTotal += step;
m++;
s++;
month = prompt("Enter a month or enter 'done' when finished:");
}
document.getElementById("totalS").innerHTML = stepTotal;
}table,
td,
tr,
th {
border: 1px solid black;
border-collapse: collapse;
}<!DOCTYPE html>
<html lang="en">
<head>
<title>Monthly Steps Page</title>
<meta charset="utf-8">
</head>
<body>
<header>
<h1>Count your steps!</h1>
</header>
<section>
<h2>Click on the buttons below to enter the number of steps taken every month.</h2>
<button onclick="getSteps();">Steps Log</button>
<br>
<br>
<table>
<tbody id="tablelog">
<tr>
<th colspan=2>Steps Entered:</th>
</tr>
<tr>
<th>Month</th>
<th>Steps</th>
</tr>
</tbody>
</table>
<p>Total Steps: <span id="totalS"> </span>
</p>
</section>
</body>
</html>关于javascript - 在 HTML 中动态显示 JavaScript 数组，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/40002713/