使用按钮显示数组内的所有值 [英] Display all the values inside an array using a button
问题描述
该功能将根据步长值显示开始编号和结束编号之间的所有偶数.例如，如果我输入1、20和3.我应该有4、10和16作为偶数.
The function will display all the even numbers between starting number and ending number based on the step value. For example, if I enter 1, 20, and 3. I should have 4, 10, and 16 as even number.
我需要将evenNum数组中的所有数字推入#result范围.
当前，它似乎只显示数组中的最后一个偶数.
I need to push all the numbers inside evenNum array into #result span.
Currently it seems to only display the last even number inside the array.
此外，如果我想在垂直线上显示所有偶数，该怎么办?
Further more, if I would like to display all even number in vertical line, how do I do it?
https://codepen.io/anon/pen/wgwaey
<body>
<div class="container">
<h1>Sample</h1>
</div>
<div class="container">
<label>Starting Number: </label>
<input id="startingNum" type="text">
<br>
<label>Ending Number: </label>
<input id="endingNum" type="text">
<br>
<label>Step: </label>
<input id="step" type="text">
<br>
<button onclick="playButton()" id="play">Display Evens</button>
</div>
<div class="container">
<p>Here are the even numbers between <span id="startNum"></span> and <span id="endNum"></span> by <span id="stepNum"></span>'s:</p>
<span id="result"></span>
</div>
</body>
JS:
<script>
function playButton(){
run();
}
function run(){
var x = parseInt(document.getElementById("startingNum").value);
var y = parseInt(document.getElementById("endingNum").value);
var z = parseInt(document.getElementById("step").value);
document.getElementById("startNum").innerHTML = x;
document.getElementById("endNum").innerHTML = y;
document.getElementById("stepNum").innerHTML = z;
var evenNum = [];
while (x < y){
if (x%2 == 0){
evenNum.push(x);
}
x += z;
for (var i = 0; i<evenNum.length; i++){
document.getElementById("result").innerHTML = evenNum[i];
}
}
}
</script>
推荐答案
问题在这里:
for (var i = 0; i<evenNum.length; i++){
document.getElementById("result").innerHTML = evenNum[i];
}
您需要将其移出 while 循环，并将其更改为
You need to move this out of the while loop and change it to
document.getElementById("result").innerHTML += ' ' + evenNum[i];
// ^ add to existing
或更简单地说，删除 for 循环并将其放在 while 循环之后:
Or, more simply, delete the for loop and put this after the while loop:
document.getElementById("result").innerHTML = evenNum.join(' ');
这篇关于使用按钮显示数组内的所有值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
