Question

这一直困扰着我，虽然有很多＆＃34;刷新DIV与jQuery＆＃34;问题在那里，没有地址（没有找到它，就是这个）这个简单的问题：在进行一些繁重的计算之前，我如何刷新（视觉方面）DIV？这个想法很简单，我用D3创建一个大图表，生成需要几秒钟，我希望能够在计算之前在overlay 中放置一个动画gif并在之后删除它。类似的东西：

$("#test").empty(); $("#test").text("Should be seen while waiting"); for (var i=1;i<2000000000;i++) { //Draw heavy SVG in #test that takes time } $("#test").empty(); $("#test").text("Ready"); $("#test").css("color", "red");

很简单，但到目前为止我还没能做到：＆＃34;等待时应该看到＆＃34;永远不会出现:(

这里的简单小提琴演示了行为：http://jsfiddle.net/StephMatte/q29Gy/

我尝试在3种不同的浏览器中使用setTimeout和jQuery的.delay（），但无济于事。

任何输入的Thanx。

Answer 1

试试这个 -

box = $("<div>", {'id': 'box'});
$("#test").append(box);

$("#box").text("Should be seen while waiting");
for (var i=1;i<2000000000;i++) {
//Draw heavy SVG in #test that takes time
}
$("#box").remove();
$("#test").text("Ready");
$("#test").css("color", "red");`

Answer 2

事实证明我只是使用了setTimeout（）的错误语法。

这就是诀窍：

$("#test").text("Is seen while generating heavy SVG");

setTimeout(function(){build_chart();}, 100);

$("#test").empty();

10毫秒还不够，但100秒足以让DIV在进行计算之前显示其新内容。

在重度计算之前刷新DIV

2 个答案: