0

假设我有这个客户端代码：

var d=document.createElement('div');
d.style.position='absolute';
d.style.width='1em';
d.style.height='1em';
d.style.background='red';
document.body.appendChild(d);
for(var i=1e7;i;--i);

它会创建一个红色方块并循环倒计时。现在我必须等待倒计时准备好才能看到红色方块。在倒计时开始之前显示正方形的最佳方式是什么？我想在超时后执行倒计时：

setTimeout(function(){
    for(var i=1e7;i;--i);
},1);

或者，还有更好的方法？我不想将我的代码重建为 WebWorkers。在我开始一些耗时的线性代码之前，只有一种简单的方式来显示消息。

我的真实生活情况是我有一个需要一些时间的庞大计算，我想在它开始之前显示一条消息。

4

1 回答 1

0

如果计算量很大，它可能会锁定您的浏览器，从而给您的用户带来非常糟糕的体验。如果是这种情况，您可以考虑在网络工作者中进行计算并将完成的消息发布回用户。

http://www.html5rocks.com/en/tutorials/workers/basics/

更简单地说，您使用 setTimetout 或 setInterval 执行某些操作，并且默认显示消息：http: //jsfiddle.net/ZHDY4/1/

我们等待 DOM 准备好，显示带有相应等待消息的红色框。

$(document).ready(function() {
    var n = 99;
    $("#counter").html("Please Wait"); 

    // Some long calculation; the red box is showing
    var a = 0;
    for(var i = 0; i < 99999; ++i) {
        for(var j = 0; j < 9999; j++) {
            a++;
        }
    }

    var counter = setInterval(function() {
        $("#counter").html(n);
        n--;

        if(n <= 0) {
            clearInterval(counter);
        }

    }, 1000);
});
于 2013-09-19T18:03:26.393 回答