当前位置：文江博客话题详情

如何在 javascript var 中预加载 html

发布于 2024-07-25 13:20:21 字数 173 浏览 5 评论 0原文

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

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

谢谢

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

日记撕了你也走了 2024-08-01 13:20:23

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

史蒂夫

回复收藏 0 原文

吃素的狼 2024-08-01 13:20:23

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();

AJAX event will not tell you how many percent was loaded, in fact, in most cases, it has no idea how long is the response will be. But it will inform you when the response is completed, or error occured.

Take a look at the official reference AJAX of JQuery. My original answer was wrong, coz I suppose you already have the data. A simplified use case for your ajax request would be:

> 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

Following is the original answer.

I think you are talking about something that's already in the client computer's memory, but you want to display all immediately once it's completed loading. Sounds like those "double buffering" in offline media.

What you can do, is:

// 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();

回复收藏 0 原文

~没有更多了~