更改SetInterval的运行间隔时间

Question

更改SetInterval的运行间隔时间

198

我编写了一个JavaScript函数，使用setInterval在一定的迭代次数内每隔十分之一秒操作一个字符串。

function timer() {
    var section = document.getElementById('txt').value;
    var len = section.length;
    var rands = new Array();

    for (i=0; i<len; i++) {
        rands.push(Math.floor(Math.random()*len));
    };

    var counter = 0
    var interval = setInterval(function() {
        var letters = section.split('');
        for (j=0; j < len; j++) {
            if (counter < rands[j]) {
                letters[j] = Math.floor(Math.random()*9);
            };
        };
        document.getElementById('txt').value = letters.join('');
        counter++

        if (counter > rands.max()) {
            clearInterval(interval);
        }
    }, 100);
};

不想将时间间隔设置为固定数值，我希望每次运行时都根据计数器进行更新。因此，不再使用以下形式：

var interval = setInterval(function() { ... }, 100);

它会类似于这样：

var interval = setInterval(function() { ... }, 10*counter);

不幸的是，那没有起作用。看起来 "10*counter" 等于0。

那么，我该如何调整每次匿名函数运行的间隔时间呢？

- Joe Di Stefano

17个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- jo_va · Answer 1

这是另一种创建减速/加速时间间隔计时器的方法。时间间隔将被乘以一个因子，直到总时间超过为止。"Original Answer"翻译成"最初的回答"。

function setChangingInterval(callback, startInterval, factor, totalTime) {
    let remainingTime = totalTime;
    let interval = startInterval;

    const internalTimer = () => {
        remainingTime -= interval ;
        interval *= factor;
        if (remainingTime >= 0) {
            setTimeout(internalTimer, interval);
            callback();
        }
    };
    internalTimer();
}

- doshi smit · Answer 2

创建新的函数：

// set Time interval
$("3000,18000").Multitimeout();

jQuery.fn.extend({
    Multitimeout: function () {
        var res = this.selector.split(",");
        $.each(res, function (index, val) { setTimeout(function () { 
            //...Call function
            temp();
        }, val); });
        return true;
    }
});

function temp()
{
    alert();
}

- mquantin · Answer 3

这段代码可以加速（acceleration > 1）或减速（acceleration < 1）setInterval函数的执行：

function accelerate(yourfunction, timer, refresh, acceleration) {
    var new_timer = timer / acceleration;
    var refresh_init = refresh;//save this user defined value
    if (refresh < new_timer ){//avoid reseting the interval before it has produced anything.
        refresh = new_timer + 1 ;
    };
    var lastInter = setInterval(yourfunction, new_timer);
    console.log("timer:", new_timer);
    function stopLastInter() {
        clearInterval(lastInter);
        accelerate(yourfunction, new_timer, refresh_init, acceleration);
        console.log("refresh:", refresh);
    };
    setTimeout(stopLastInter, refresh);
}

使用：

timer：以毫秒为单位设置setInterval的初始值（递增或递减）
refresh：计算timer新值之前的时间。这是“步长”
acceleration：旧的和下一个timer值之间的差距。这是“步高”

- Nabi K.A.Z. · Answer 4

这是我针对不想让像setInterval这样的循环重叠时的解决方案。
您还希望能够设置循环执行延迟并即时启动和停止循环。
我使用了一个loop_flag变量和一个setTimeout函数。
我将主函数设置为async，以便您可以通过调用await来调用主体中的其他函数。当您的代码主体正在运行时，主循环会等待并且不会重复自己。（这与setInterval不同）

一个简单代码示例：

//@NabiKAZ

document.getElementById("btn_start").addEventListener("click", function() {
  console.log("Starting...");
  loop_flag = true;
  loop_func();
});
document.getElementById("btn_stop").addEventListener("click", function() {
  console.log("Stoping...");
  loop_flag = false;
});

var n = 0;

var loop_flag = false;
var loop_func = async function() {
  if (!loop_flag) {
    console.log("STOP.");
    return;
  }

  //body main function inhere
  n++;
  console.log(n);
  ////


  if (loop_flag) {
    setTimeout(loop_func, document.getElementById("inp_delay").value);
  } else {
    console.log("STOP.");
  }
}

<input id="inp_delay" value="1000">
<button id="btn_start">START</button>
<button id="btn_stop">STOP</button>

如需在循环内使用获取请求的更完整代码，请参见此处：

https://jsfiddle.net/NabiKAZ/a5hdw2bo/

- Aleksandra Marusii · Answer 5

你可以使用一个变量并改变这个变量。

setInterval(() => function, variable)

- flodis · Answer 6

受上述“内部回调”的启发，我编写了一个函数，在分钟的分数处触发回调。如果将超时设置为6,000、15,000、30,000、60,000等间隔，则它将持续同步适应您系统时钟下一分钟的精确过渡的间隔。

//Interval timer to trigger on even minute intervals
function setIntervalSynced(callback, intervalMs) {

    //Calculate time to next modulus timer event
    var betterInterval = function () {
        var d = new Date();
        var millis = (d.getMinutes() * 60 + d.getSeconds()) * 1000 + d.getMilliseconds();
        return intervalMs - millis % intervalMs;
    };

    //Internal callback
    var internalCallback = function () {
        return function () {
            setTimeout(internalCallback, betterInterval());
            callback();
        }
    }();

    //Initial call to start internal callback
    setTimeout(internalCallback, betterInterval());
};

- Hamidreza · Answer 7

var counter = 15;
var interval = function() {
    setTimeout(function(){
        // Write your code here and remove console.log, remember that you need declare yourDynamicValue and give it a value
        console.log((new Date()).getTime())

        window.counter = yourDynamicValue;
        window.interval();
    }, counter);
}

// 第一次运行的时候需要初始化

interval();