window.settimeout在javascript加载太快

时间:2013-10-10 13:56:32

标签: javascript html

我有这个js代码,必须在我的页面加载时使面板的高度更大。但它似乎加载得太快了。

var TimerID;

function LoadDoc() {
    for(i=0;i<=100;i++){    
        TimerID=window.setTimeout(MoveRolldownDown(i),5000);
    }
}

function MoveRolldownDown(i){
    document.getElementById('Rolldown').style.height=i + '%';
    window.clearTimeout(TimerID);
}

这几乎立即加载到页面中,因此如何使此负载变慢。在我的HTML页面顶部,我有这个代码

document.onreadystatechange = function () {
    if(document.readyState === "complete"){
        LoadDoc();
    }
}  

2 个答案:

答案 0 :(得分:2)

第一件事 - 您的函数正在立即执行,因此您需要将它们放在另一个函数中。

还有一件事 - 所有的超时时间基本上同时结束!

尝试这样的事情:

function LoadDoc() {
    for (i = 0; i <= 100; i++) {
        var down = i;
        setTimeout((function (down) {
            return function(){ //return function for timeout
                MoveRolldownDown(down);
            };
        })(i), 10 * i);
    }
}

function MoveRolldownDown(i) {
    document.getElementById('Rolldown').style.height = i + '%';
}

演示:http://jsfiddle.net/maniator/RTaZh/

答案 1 :(得分:-1)

是的,因为你在参数中调用了这个函数,

你可能想要像

这样的东西
window.setTimeout(MoveRolldownDown,5000, [i]);

https://developer.mozilla.org/en-US/docs/Web/API/Window.setTimeout