页面加载时显示 (javascript) 弹出窗口
我一直在尝试为我的问题找到一个简单的解决方案，但我做不到。我有一个带有 while php 子句的页面，它创建一个 html 表，需要一段时间才能完成。我只想在用户访问页面（加载时）时显示一个弹出窗口，说一些简单的内容，例如：“页面加载...请稍候”。这可以用 javascript 库来完成吗？ （也许只有 JS？）我发现的每个解决方案都与 div、类等混在一起，我发现它有点难以使用，因为我的代码此时有点非结构化。谢谢。
I have been trying to find a simple solution for my problem but I can't. I have a page with while php clause that creates an html table and it takes a while to finish. I just want a popup window displayed when the user visits the page (on load) saying something simple like: "Page loading... Please wait". Can this be done with a javascript library? (exclusively with JS perhaps?) Every solution I've found messes with divs, classes, etc and I find it a bit difficult to use because my code is kind of unstructured at this time. Thanks.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（4）
至于执行“弹出窗口”的 JS，我很喜欢 SimpleModal。
但更重要的是，听起来您可能希望摆脱内联渲染的长时间加载表。相反，将除表格之外的所有内容渲染到页面并显示“正在加载...”指示器。然后，对表发出 AJAX 请求。根据您的偏好，AJAX 调用可以返回包含所有 HTML 的表，或者您可以仅以 JSON 格式检索数据并在客户端构建表。这将是解决此类问题的一种非常典型的方法。
As far as the JS to do the "popup" I've enjoyed SimpleModal.
But more importantly, it sounds like you probably want to get away from the long-loading table being rendered inline. Instead, render everything but the table to the page and display your "Loading..." indicator. Then, make an AJAX request for the table. Depending on your preference, the AJAX call can return the table with all the HTML or you can just retrieve the data in a JSON format and build the table on the client side. This would be a very typical approach for this kind of problem.
JavaScript 工具包只会自动处理您想要避免的 DOM 混乱。他们就是这样工作的。 JavaScript 只是为这种场景编写 DOM 脚本。
你能做的就是寻找一个廉价的剪切和粘贴示例，该示例展示了如何制作一个无论如何都会占据大部分屏幕空间的大型 CSS 框。也许是侧面有不透明区域的东西。您将该内容放在
标记后面，然后编写几行 JavaScript，在窗口的ready事件中删除该框。JavaScript 模态对话对您来说是一个问题，因为当 DOM 尚未完成初始化时，大多数对话都会出现工作问题（这就是为什么几乎所有 jQuery 和 Ext 示例都包含在一些
onReady 中事件处理程序）。JavaScript toolkits would just automate the messing with the DOM that you want to avoid. That's how they work. JavaScript just scripts the DOM for this sort of scenario.
What you can do is look for a cheap cut-and-paste sample that shows how to make a big CSS box that will take over most of the screen real estate no matter what. Maybe something with an opaque area around the side. You put that content right after the
<body/>tag and you can write a few lines of JavaScript that, on thereadyevent for the window just removes that box.The thing about JavaScript modal dialogues that will be a problem for you is that most of them will have issues working when the DOM hasn't finished initializing (which is why almost all jQuery and Ext samples out there are wrapped in some
onReadyevent handler).在页面完全加载之前，您可以在原始框架上使用 iframe。基本思想是加载一个带有加载图像的框架，然后在 DOM 完全加载后使用 .ready 处理程序删除该框架并插入 iframe 。
Well till your page is completely loaded you can use an iframe over the original frame. The basic idea is to load a frame which carries your load image and then after the DOM is fully loaded use say .ready handler to remove the frame and inset the iframe .
您可以在隐藏的
iframe中加载原始网页（HTML 表），并在页面上显示加载消息。然后使用onload属性隐藏加载消息并显示iframe。编辑：类似地，您可以有一个空白的、边到边的元素覆盖页面内容，并使用众多替代警报选项之一（例如 jQuery）。然后，使用
body onload，删除空白元素并发出警报；或者用新的警报替换警报，通知加载完成； ETC。You could load the original webpage (HTML table) in a hidden
iframeand have a loading message on the page. Then use theonloadattribute to hide the loading message and display theiframe.Edit: on a similar note, you could have a blank, edge-to-edge element covering the page content and use one of the numerous alternative alert options over that (e.g. jQuery). Then, using
body onload, remove the blank element and alert; or replace the alert with a new one, notifying that loading is complete; etc.