8

我正在填充一个包含大约 500 行的表，这需要浏览器几秒钟来呈现，而它看起来是冻结的。这就是为什么我想显示一条请求用户耐心的消息：

$.ajax({
  url: '{{ search_url }}',
  success: function (response) {
    $('#progress').text('Rendering results, please wait...');
    clear_table();
    populate_table(response);
  }
});

该消息未显示 - 显然浏览器（在 Chrome 23 中测试）缓冲所有 DOM 更改并一次性呈现它们。

作为一种解决方法，我发现当我延迟填充表直到执行返回到事件循环时，实际上会显示消息：

$.ajax({
  url: '{{ search_url }}',
  success: function (response) {
    $('#progress').text('Rendering results, please wait...');
    window.setTimeout(function () {
      clear_table();
      populate_table(response);
    }, 0);
  }
});

我想知道这种方法是否总是有效，或者这种情况是否有更好的技术。

4

1 回答 1

3

这是因为 Javascript 执行是单线程的。所以在你所有的 JS 代码被执行之前，浏览器不会做任何事情——换句话说，它会冻结。为了防止这种情况发生，我建议您使用jQuery Async 插件（只需几行代码），它会定期将控制权交还给浏览器（通过使用setTimeout）。这可以防止浏览器冻结并显示等待消息而不会出现任何问题。

于 2012-11-24T00:14:12.470 回答