本文介绍了使用JQuery加载页面时显示动画的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个从数据库获取信息的页面。它导出了大量的信息,所以加载需要几秒钟。我有一个动画,但它不是行为,我想要它的行为。当用户点击链接时,我想要立即加载动画,并显示,直到页面上的数据实际加载。

I have a page that takes information from a database. It exports a lot of information, so it takes a few seconds to load. I do have an animation, but it is not behaving how I want it to behave. When a user clicks on a link, I want there to be a loading animation instantly, and it shows until the data on the page actually loads.

这里是它实际上做:
当我点击一个链接,我等待5秒,然后页面加载动画,然后加载数据。问题是,我想让动画立即运行,不等待5秒,然后运行半秒,然后加载数据。

Here is what it actually does:When I click on a link, I wait 5 seconds, then the page loads with the animation, then the data loads. The problem is that I want the animation to run instantly, not wait 5 seconds, then run for half a second, then the data loads.

这里是我当前的JQuery代码:

Here is my current JQuery code:

$(document).ready(function() {
  $("#content").hide();
  $(window).load(function() {
    $("#content").show();
    $("#content-loading").hide();
  })
})

content是需要一段时间加载和内容加载具有加载动画。

content is the content that takes a while to load and content-loading has the loading animation.

推荐答案

$(document).ready 只会在DOM完成下载时运行,基本上是在页面末尾下载< / html> 。如果你的数据库数据是页面的一部分,它将在DOM就绪事件触发时加载。同时, $(window).load()将在页面上的所有资源都加载时触发;所有图片,外部样式表等。

$(document).ready() will only run when the DOM is done downloading, basically when </html> is downloaded at the end of your page. If your database data is part of the page, it will be loaded by the time the DOM ready event fires. Meanwhile, $(window).load() will fire when all the resources on the page have loaded; all the images, external stylesheets, etc.

也许你可以在隐藏内容的数据之前有一个样式表,然后在页面底部有一个内部样式表

Perhaps you could have a stylesheet before the data which hides the content, then an internal stylesheet at the bottom of your page, after the data, which makes the content display and the #content-loading element hidden?

否则,您可以使用AJAX或在框架中以某种方式异步加载数据。

Otherwise, you could load the data asynchronously in some way, with AJAX or in a frame.

这篇关于使用JQuery加载页面时显示动画的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

09-02 12:11