Javascript For-Loop问题

Question

我尝试以200毫秒的间隔点击每一项，我写了以下脚本，但For循环似乎有问题。有人能告诉我你认为它有什么问题吗？

function clickLink(elm) {
    var evt = document.createEvent('MouseEvents');
    evt.initMouseEvent('click', true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
    elm.dispatchEvent(evt);
}

function sel() {
    elms = document.getElementsByClassName('uItem');
    var inputs= elms;
    var howbig= elms.length;
    console.log(howbig);

    for (var i=250;i<elms.length;i++)
    {
        setTimeout(clickLink(inputs[i]),200)
    };

页面上有1400个uItem。

Answer 1

最干净的解决方案是让你的clickLink函数返回一个函数。

function clickLink(elm) {
    return function() {
        var evt = document.createEvent('MouseEvents');
        evt.initMouseEvent('click', true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
        elm.dispatchEvent(evt);
    };
}

然后交错计时器，如果你想要一个间隔：

var start = 250
for (var i=start;i<elms.length;i++) {
    setTimeout(clickLink(elms[i]), 200 * (i - start))
}

或者丢弃循环，并使用setInterval

var i = 250,
    len = inputs.length;
var itvl = setInterval(function() {
    clickLink(elms[i++]);
    if (i >= len)
        clearInterval(itvl);
}, 200);

并返回到原始的clickLink函数

Answer 2

如果您使用的是较新版本的JavaScript，最简单的方法就是使用bind。这将创建一个绑定了参数的函数对象，这些参数是在调用bind时计算的，而不是稍后计算的。您想要的代码行如下：

setTimeout( clickLink.bind( null, inputs[i] ),  /* delay expression here */ )

您可以显式地创建绑定函数，但它很难看，而且只有在强烈要求支持旧的JavaScript解释器的情况下才应该这样做。

Answer 3

这里有一个关于ì的范围的问题，需要使用i相应地递增的延迟以具有200毫秒的间隔，以及setTimeout需要一个函数作为参数的事实。

    for (var i=250;i<elms.length;i++)
    {
        setTimeout((function() {
            var j = i // keep i as j in this closure
            return function() { // return the right function
                clickLink(inputs[j])
            }
        })(),200 * i) // set the delay depending on i
    };