javascript - 在长时间运行的函数中强制使用 jQuery 修改 DOM 立即更新

Question

我有一个执行大约需要 2 秒的 javascript（复杂的优化算法）。我想在函数开始时将某个跨度设置为“工作...”。我观察到跨度在函数结束之前不会改变。

如何强制 DOM 更改传播？还是我应该一起以不同的方式处理这个问题？

我从按钮上的 onclick 调用该函数。

该功能类似于：

function optimize() {
    $('#status').text('working...');
    // calculate for 2 seconds
    $('#status').text('done!');
}

Answer 1

尝试将长时间运行的代码包装在 setTimeout 调用中：

function optimize() {
    $('#status').text('working...');
    window.setTimeout(function() {
        // calculate for 2 seconds
        $('#status').text('done!');
    }, 0);
}

这会为长时间运行的代码强制一个新的调用堆栈，从而允许在新的调用堆栈开始执行之前完成重绘（更改文本）。