Question

我在Javascript中有以下代码用于淡入淡出动画：

var ticks = 20;
function fadein(tick,element){
    if(element == null)
        return;

    element.style.opacity = tick/ticks;
    if(tick < ticks) {
        var s = "fadein(" + (tick+1) + "," + element + ")";
        setTimeout(s, 500/ticks);
    }
}

问题在于这一行：

var s = "fadein(" + (tick+1) + "," + element + ")";

元素变为其字符串表示形式，并在下一次迭代时导致错误。我知道如果我的所有元素都通过eid传递ID，我可以这样做，但我希望淡化很多不同的东西（在不同的时间）并且不想为每个元素命名。有没有办法在js中做到这一点？

Answer 1

使用匿名函数代替字符串来调用setTimeout。这样您就可以轻松访问fadein函数中的所有变量。

除此之外，将setTimeout或setInterval与字符串参数一起使用也被视为不良做法。

var ticks = 20;
function fadein(tick,element){
    if(element == null)
        return;

    element.style.opacity = tick/ticks;
    if(tick < ticks) {
        setTimeout( function() { fadein( tick+1, element ); }, 500/ticks);
    }
}

Answer 2

使用函数而不是字符串：

var f = function () { fadein(tick+1, element) };
window.setTimeout(f, 500/ticks);

这样您就可以将元素作为参数发送，而不必将其转换为字符串表示形式。

在setTimeout方法中使用字符串曾经是唯一的方法，但现在使用函数被认为是更好的做法。

Answer 3

你可以传递一个函数而不是你的字符串... pure js

setTimeout(function(){.....}, 500/ticks);

在Javascript中调用没有元素ID的setTimeout

3 个答案: