javascript - 如何在 javascript var 中预加载 html

Question

我有一个正在开发的网站。我正在使用 jquery 动画和显示内容。此内容存储在 vars 中。在显示内容之前，我需要知道如何加载内容。

为了澄清起见，您单击一个链接，“正在加载...”窗口淡入，一旦它加载了所有内容，它就会淡出并淡入存储在 vars 中的加载内容。

谢谢

Answer 1

您是否正在寻找如何通过 AJAX 请求 HTML 内容，知道何时完成，然后将其插入 DOM？如果是这样，jQuery 的load方法可能就是你所追求的。

史蒂夫

Answer 2

AJAX 事件不会告诉你加载了多少百分比，事实上，在大多数情况下，它不知道响应将持续多长时间。但它会在响应完成或发生错误时通知您。

看一下JQuery 的官方参考 AJAX。我原来的答案是错误的，因为我想你已经有了数据。您的 ajax 请求的简化用例是：

> Initiate the Request, and set the handler for ajax complete (thru something like $.Ajax)
> Hide the content pane and show the loader
> When ajax complete, you display your content, and hide the loader

---

以下是原始答案。

---

我认为您正在谈论的内容已经在客户端计算机的内存中，但是您希望在完成加载后立即显示所有内容。听起来像是离线媒体中的“双缓冲”。

你能做的是：

// Display the loading screen, you can put any animation
$("#loader").fadeIn();
$("#contentPlaceHolder").hide();
// attach the DOM of the contents to placeholder.
$("#contentPlaceHolder").append(CONTENTS);
// .... similar statements follows.
// and finally..
$("#contentPlaceHolder").show();
$("#loader").fadeOut();

---