jquery - jQuery：在 Ready 事件期间增加感知响应能力

Question

• 在文档就绪时启动代码是 jQuery 的支柱。
• 但有时，会在 ready 事件中执行冗长的操作。
  • 例如，将多个轮播实例附加到冗长的无序列表将需要一些时间。

问题：

如何在就绪事件期间提高感知响应能力？

例如：

• 我可以用“你知道吗？”弹出一个厚盒实例？隐藏底层 DOM 操作的部分？
  • ...然后在 ready 事件完成时自动关闭该thickbox 实例？

Answer 1

你给用户的每一个反馈都会导致更好的感知响应。加载图像是经典的 - 并且众所周知（即与用户思维模型一致）。厚框本身可能很烦人 - 但如果你将它与加载消息结合起来，正如大多数游戏行业的人已经发现的那样，它会通过同时教育用户和提供反馈来产生更好的结果。

[编辑]

像这样的东西：

$(function() {
    tb_show(caption, url, imageGroup); // show thickbox

    /* lengthy operation here */

    tb_remove(); // remove thickbox
});

[/编辑]

Answer 2

除了进度指示器之外，您还可以使用 JavascriptsetTimeout函数以非常短的超时时间并行化多个操作。这有效地允许您在浏览器中使用多个线程，异步运行每个操作。

仅当您的操作在排序或计时方面不相互依赖时才使用此技术，并且不要一次创建太多超时，否则您可能会由于内存使用量增加而导致浏览器挂起。

另请注意，浏览器有一个最小超时时间，通常在 10-20 毫秒左右，但在浏览器之间会有所不同；它应该足够短以至于不引人注意。如果将超时设置为 0，它将默认为浏览器最小值。

这是轮播设置的简单示例，将列表分为两组：

setTimeout(function () {
    // code for attaching first carousel group
    // ...
}, 0);
setTimeout(function () {
    // code for attaching second carousel group
    // ...
}, 0);