如何在昂贵的计算任务之前单击将文本追加到DOM
如何在昂贵的计算任务之前单击将文本追加到DOM
提问于 2011-12-19 13:08:20
我有一个函数，它在点击事件上执行一个非常昂贵的计算任务。我想在调用此函数之前将一些文本附加到DOM中。如下所示：
$("#button2").click(function() {
$('#progress').append('<p>Computing…</p>');
run(); // Expensive computational task.
return false;
});由于某种原因，直到代价高昂的计算任务完成后，文本才会被附加到DOM中。为什么会出现这种情况，我该如何解决？
回答 3
Stack Overflow用户
回答已采纳
发布于 2011-12-19 13:31:29
文本确实会立即被追加-只是浏览器不会刷新屏幕，直到你执行完javascript (它在等待，看看你是否对DOM做了更多的更改，这样它就可以回流和重新绘制所有的更改)。
让屏幕立即刷新的方法是立即返回并在非常短的setTimeout()上启动run()，如下所示：
$("#button2").click(function() {
$('#progress').append('<p>Computing…</p>');
setTimeout(run, 1); // Expensive computational task.
return false;
});Stack Overflow用户
发布于 2011-12-19 13:11:44
在调用run()时使用setTimeout怎么样？
Stack Overflow用户
发布于 2011-12-19 13:15:58
我不确定为什么会这样，但是为什么不把对run的调用推迟到附加文本之后呢？尝试如下所示：
$.when($('#progress').append('<p>Computing…</p>')).then(run);页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/8557334
复制相关文章
相似问题
腾讯云开发者
