尝试按给定值递增数字

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (1)
  • 关注 (0)
  • 查看 (23)

我有一行从1到10的数字。我希望能够选择行的起始编号,这会将值1更改为用户输入的内容。然后我希望能够在第一个数字之后递增每个数字,而不是用户选择的数字。例如,如果用户选择起始编号为10且增量为5,则该行将如下所示:10,15,20,25,35 ...等我几乎在那里,但我无法弄清楚出了什么问题,在第一个数字之后,它增加数字,但从输入的值开始,而不是添加到前一个值。简而言之,我希望它将增量值添加到数组中的前一个数字,并将其值再次替换为5,10,15,20,直到数组结束。很抱歉,如果HTML看起来很糟糕,那么当我粘贴它时它就会出现问题。

let xSt = document.getElementById("xStart");
let xInc = document.getElementById("xIncr");
let xs = document.getElementsByClassName("xs");

//changes first number to entered value in the text box
xSt.addEventListener("keydown", function(ev){
	if(ev.keyCode == 13){  
		xs[0].innerHTML = xSt.value;
	};
});

//supposed to add the entered value to the previous value each time
xInc.addEventListener("keydown",function(ev){
	if(ev.keyCode == 13){
		let lp = 1;
		xs[9].innerHTML = xInc.value * 10;
		for (let i=1; i < xs.length; i++){		
			xs[i].innerHTML = xInc.value * lp++;
		};
	};
});
<div id="x1" class="xs">1</div>
<div id="x2" class="xs">2</div>
<div id="x3" class="xs">3</div>
<div id="x4" class="xs">4</div>
<div id="x5" class="xs">5</div>
<div id="x6" class="xs">6</div>
<div id="x7" class="xs">7</div>
<div id="x8" class="xs">8</div>
<div id="x9" class="xs">9</div>
<div id="x10" class="xs">10</div>
<table>
	<tr>
	<td>
	<div id="Manual">Manual Graph Values</div>
	</td>
	</tr>
	<tr>
	<td>
	<input id="xStart" type="text" placeholder="Number where X starts">
	<input id="yStart" type="text" placeholder="Number where Y starts">
	</td>
	</tr>
	<tr>
	<td>
	<input id="xIncr" type="text" placeholder="How much X increments">
    <input id="yIncr" type="text" placeholder="How much Y increments">
	</td>
	</tr>
	</table>
提问于
用户回答回答于

你需要从0开始循环,但从1开始,所以它不会改变第一个。此外,i在每个循环中都有所增加,因此您不需要lp

let start = +xSt.value
for (let i=0; i < xs.length; i++){      
    xs[i].innerHTML = start + xInc.value * i;
}

我已经更改了第二个eventListener

let xSt = document.getElementById("xStart");
let xInc = document.getElementById("xIncr");
let xs = document.getElementsByClassName("xs");

//changes first number to entered value in the text box
xSt.addEventListener("keydown", function(ev){
	if(ev.keyCode == 13){  
		xs[0].innerHTML = xSt.value;
	};
});

//supposed to add the entered value to the previous value each time
xInc.addEventListener("keydown",function(ev){
	if(ev.keyCode == 13){
		let start = +xSt.value
        for (let i=0; i < xs.length; i++){      
           xs[i].innerHTML = start + xInc.value * i;
        }
	};
});

<div id="x1" class="xs">1</div>
<div id="x2" class="xs">2</div>
<div id="x3" class="xs">3</div>
<div id="x4" class="xs">4</div>
<div id="x5" class="xs">5</div>
<div id="x6" class="xs">6</div>
<div id="x7" class="xs">7</div>
<div id="x8" class="xs">8</div>
<div id="x9" class="xs">9</div>
<div id="x10" class="xs">10</div>
<table>
    <tr><td><div id="Manual">Manual Graph Values</div></td></tr>
    <tr><td><input id="xStart" type="text" placeholder="Number where X starts"><input id="yStart" type="text" placeholder="Number where Y starts"></td></tr>
    <tr><td><input id="xIncr" type="text" placeholder="How much X increments"><input id="yIncr" type="text" placeholder="How much Y increments"></td></tr>
 </table>

扫码关注云+社区

领取腾讯云代金券