如何使用javascript制作一个每秒添加特定数字的计数器?

我有以下代码,每秒应添加 2.6 。但第一次添加后我得到 8。我该如何解决这个问题?在此处的测试器上它可以工作,但在我的页面上我得到 8 https://260044-5.web1.fh-htwchur.ch/

提前致谢。

setTimeout(start, 0000);

var i = 2.6;

var num = document.getElementById('humans');


function start() {

  setInterval(increase, 1000);

}


function increase() {

    if (i < 100000000) {

      i += 2.6;

      num.innerText = Math.round(i);

    }

}

<div id="humans">2.6</div>

<p>Menschen wurden geboren.</p>


精慕HU
浏览 131回答 3
3回答

米琪卡哇伊

你可以试试这个。主要问题是你的四舍五入,你基本上使用了Math.round(),但你正在处理浮点数据类型。因此,只需使用您要显示的小数点位数即可YourNumber.toFixed(n)。n您可以在下面查看。我只是让你的代码变得更短和简短,但你基本上可以改变你的代码的四舍五入,它应该可以工作。setTimeout((function(){&nbsp; var i = 2.6;&nbsp; return function start() {&nbsp; &nbsp; setInterval(()=> {&nbsp; &nbsp; &nbsp; if (i < 100000000){&nbsp; &nbsp; &nbsp; &nbsp; i += 2.6;&nbsp; &nbsp; &nbsp; &nbsp; document.getElementById('humans').innerText = i.toFixed(1);&nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; }, 1000);&nbsp; };})(), 0000);<div id="humans">2.6</div><p>Menschen wurden geboren.</p>

ITMISS

您在设置文本时对值进行四舍五入:num.innerText&nbsp;=&nbsp;Math.round(i);如果你想显示小数点后第n位的值,只需使用toFixed.&nbsp;例子:num.innerText&nbsp;=&nbsp;i.toFixed(1);&nbsp;/*&nbsp;will&nbsp;give&nbsp;you&nbsp;one&nbsp;number&nbsp;after&nbsp;the&nbsp;decimal&nbsp;point&nbsp;*/

白板的微信

这里的代码可以工作,但是在您发布的链接中,您的脚本中有该代码://funtion for humans bornsetTimeout(start, 0000);var i = 2.6;var num = document.getElementById('humans');function start() {&nbsp; setInterval(increase, 1000);}function increase() {&nbsp; &nbsp; if (i < 100000000) {&nbsp; &nbsp; &nbsp; i += 2.6;&nbsp; &nbsp; &nbsp; num.innerText = Math.round(i);&nbsp; &nbsp; }}//funtion for trees cutsetTimeout(start, 0000);var t = 475.646879756;var t = document.getElementById('trees');function startTwo() {&nbsp; setInterval(increase, 1000);}你执行了start两次:一次是在“人类诞生”之后,另一次是在“树木被砍伐”之后。increase因此,您有两个并发间隔,每秒执行两次,并且每个increase调用都操作相同的变量。这就是为什么你立刻就得到了8。我不确定你在这里的目标是什么,但是你要么有不同的变量/函数来每秒增加“人类出生”和“树木被砍伐”,要么你有一个start调用(因此increase每秒调用一个函数)。无论如何,这是你的错误:如果你想澄清你的逻辑;我/我们可以提供进一步的帮助。
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

Html5