Question

所以我认为以下代码非常简单，但已成为一个令人头痛的问题。它应该是一个循环，它将改变对象的不透明度，使其消失。

function doSomething()
{
    var i = 10;
    for(i = 10; i >=0; i = i - 1)
    {
        setTimeout("setOpacity('t1',"+ i +")", 100*i);
        WRITE 1
    }
}

function setOpacity(elem, hmm)
{
    WRITE 2
    document.getElementById(elem).style.opacity = (10 - hmm)/10;
    document.getElementById(elem).style.filter = 'alpha(opacity=' + (10 - hmm)*10 + ')';
}

所以问题是for循环从10倒数到0，这已经由位于WRITE 1的print语句确认。但是在setOpacity方法中，接收的数字从0开始并计数到10并且这已得到WRITE 2的印刷声明的证实。

我想知道为什么会这样，以及我如何解决它。我相信它与循环结束后执行方法调用的setTimeout调用有关，但如果是这样，那么为什么传递给setOpacity的值会递增？

非常感谢任何帮助。

Answer 1

传递给setOpacity的值正在增加，因为您传递的是不同的超时。循环的结果基本上如下：

setTimeout("setOpacity('t1', '10')", 1000)
setTimeout("setOpacity('t1', '9')", 900)
setTimeout("setOpacity('t1', '8')", 800)
....
setTimeout("setOpacity('t1', '0')", 0)

结果是根据时间以相反的顺序调用它们。所以最后一次调用在0ms内执行（函数完成后），结果为0 hmm，然后是1,2,3 ......

要解决此问题，您需要将100*i更改为100 * (10 - i)

Javascript for循环和setTimeout问题

1 个答案: