js循环累加,累加到已知数为止

clipboard.png

arr的数组【8,6,15,24,60】,

要做的效果:
例如数字8;
先显示0++,然后一直累加到8,停止。

js怎么写哟

clipboard.png

图片里面的数字初始为0;

每秒加1一直加到上面图片显示的数字就停


@hsfzxjy update:

经过与题主的讨论,问题整理如下:

  • 界面上有五个 <div class="countNum"></div>,用于显示数字,初始时数字均为 0

  • 数组 arr 存储的是五个 div 显示的数字的上限

  • 程序开始时,每个 div 中的数字每隔一秒自增 1,直至到达上限,自增停止

阅读 14.5k
4 个回答
for (var i = 0; i < arr[0]; i++) {
    // 依次显示 i
}

这样么?完全不知道你在说什么!


https://jsfiddle.net/hsfzxjy/aaneazun/2/

let a = [8, 6, 15, 24, 20];

function increase (index, current) {
    let sup = a[index];
    if (current > sup) return;
    
    $(`.countNum:eq(${index})`).text(current);
    
    setTimeout(() => {
        increase(index, current + 1)
    }, 1000);
}

for (let i = 0; i <= a.length; i++) increase(i, 0);

拿好不送


ES 5 version:

var a = [8, 6, 15, 24, 20];

function increase (index, current) {
    var sup = a[index];
    if (current > sup) return;
    
    $(".countNum:eq("+index+")").text(current);
    
    setTimeout(function () {
        increase(index, current + 1)
    }, 1000);
}

for (var i = 0; i <= a.length; i++) increase(i, 0)

自己转嘛

var sum = 0;//预先显示的数字
for (var i = 0; i < 8; i++) {
    sum += i;
}

败给你了,你那个数组到底干嘛用的? 一直也没说。如果单纯累加的话,完全可以把累加次数设成参数由方法外部传入。

顺手写了一下~

    var arr = [8,6,15,24,60];
    var cns = document.getElementsByClassName('countNum');
    var interval = setInterval(function(){
        var r = 0;
        arr.forEach(function(o, i){
            var text = +cns[i].innerHTML;
            if(text < arr[i]){
                cns[i].innerHTML = ++text;
                r++;
            }
        });
        r == 0 && clearInterval(interval);
    }, 100);
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题