我是初学者。我有一个网页设计任务(使用Javascript和HTML5),要求我使用do while循环来提示用户输入一个月以及该月所采取的步骤数量。这应该动态填充我的HTML中的列表,以便该站点应显示两列,并输入值。例如:
输入的步骤:
月:步骤:
15000年5月
6月20000
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>
答案 0 :(得分:2)
您在months[m]
后测试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>
答案 1 :(得分:0)
如果您使用console.log检查months[m-1]
它是未定义的,那么您应该检查<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++;
console.log(m);
console.log(s);
console.log(months[m]);
}while (months[m-1] != "done");
document.getElementById("totalS").innerHTML = "Total Steps: " + stepTotal;
}
</script>
如果您需要使用do,那么您的脚本将如下所示:
alias
最后,在你写完“完成”之后,它仍然会问。用while()会更好。因此,如果没有必要使用do while - 只使用while。