如何在加载整个页面之前显示jquery对话框？

在我的网站上，许多操作可能需要很长时间才能完成。

当我知道页面需要一段时间才能加载时，我想在页面加载时显示进度指示器。

理想情况下，我想说的是：

$("#dialog").show("progress.php"); 

并将该叠加层放在正在加载的页面顶部（在操作完成后消失）。

编写进度条并显示进度不是问题，问题是在加载页面时弹出进度指示器。 我一直在尝试使用JQuery的对话框，但它们只在页面加载后出现。

这必须是一个常见的问题，但我不熟悉JavaScript，知道最好的方法。

这是解释问题的简单示例。 在20秒暂停之前，下面的代码无法显示对话框。 我曾尝试使用Chrome和Firefox。 事实上，我甚至没有看到“请等待……”文字。

这是我正在使用的代码：

         
My Dialog
  $("#please-wait").dialog();     

Answer 1

您需要在标记之后立即运行该段代码，例如：

     
  ....   

注意我省略了传统的$（function（）{}）因为你需要在显示页面时加载它，而不是在加载整个DOM之后加载。

我以前做过这个并且工作得很好，即使页面还没有完成加载。

编辑：你必须确定你正在使用的jQuery对话框插件是在整个DOM加载之前加载的。 通常情况并非如此，你不会工作。 在这种情况下，您需要使用一个简单的JavaScript解决方案，例如Lightbox 1或Lightbox 2 。