gpt4 book ai didi

jquery - 如何在加载数据时创建页面叠加 - asp.net/jquery/blockui

转载 作者:行者123 更新时间:2023-12-03 22:56:55 24 4
gpt4 key购买 nike

当从 SQL 服务器检索数据时,我试图显示一个叠加层,上面写着“页面正在加载...请稍候”。我希望为此使用 BlockUI 插件,但任何方法都可以。我有一个使用 site.master 的 ASP.NET 页面。该插件可以工作,但无论我尝试什么,它只会在页面完全加载后才会出现。

大部分等待时间都取决于 Global.asax 文件中完成的工作。在 Session_Start 部分中,我有一个函数返回数据以填充页面上的下拉菜单。这大约需要 20 秒才能完成。

那么,我需要做什么才能在页面完全加载之前查看叠加层?感谢您的帮助或建议。

最佳答案

对于加载页面,插件无法解决问题

如果您希望页面在加载之前被阻止,内容拦截器元素应该是页面的一部分,而不是由始终在页面加载后运行的任何插件生成。在某个时间点或另一个时间点。

<body>
...
<!-- make it last -->
<div id="blocker">
<div>Loading...</div>
</div>
</body>

让 CSS 完成剩下的工作

#blocker
{
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: .5;
background-color: #000;
z-index: 1000;
}
#blocker div
{
position: absolute;
top: 50%;
left: 50%;
width: 5em;
height: 2em;
margin: -1em 0 0 -2.5em;
color: #fff;
font-weight: bold;
}

以及清除阻塞的 Javascript:

$(function(){
$("#blocker").hide();
});

这是一个working example使用上面的代码。它会在超时时删除阻止程序,因为它是一个非常简单的文档。

重要通知

但也许您没有正确理解这一点。也许您想在现有页面回发到服务器时阻止现有页面,因为这是一个不同的故事。在这种情况下,您的插件应该足够了,并且应该在 unload 窗口事件和显示阻止程序元素上运行。这会在现有页面回发数据时以及浏览器开始接收新内容之前阻止现有页面(可以使用之前显示的技术来阻止)。

问题似乎是浏览器等待服务器响应

这很难说,因为你自己无法确定。但假设问题是浏览器正在等待服务器响应。正如您提到的, session 加载速度很慢。两件事:

  1. 优化数据库调用以更快地获取这些菜单数据(如果真的需要那么长时间 - 您是否使用分析器检查过?)
  2. 有一个静态默认 HTML 页面,用于显示正在加载内容并执行重定向:
    • 使用 META 刷新标记 - 对于旧浏览器和没有 JavaScript 的浏览器来说更安全
    • javascript - 更适合现代页面,特别是因为您的页面使用 Javascript(__doPostback 任何人)

看来你最好的选择是两者的结合。但一次走一步,看看是否会更好。

还有一件事。我知道等待第一个响应(应用程序启动)需要一些时间。很多页面都是这样做的。但人们通常不会真正打扰,因为用户无法对数据造成任何伤害,因为它仍然没有显示。当使用页面时响应时间很长时,情况会更糟,因为用户往往会多次单击同一按钮(例如在创建/更新数据时)。这危害更大。

也许您将 Asp.net 应用程序启动与 session 加载混淆了。当您的应用程序首次启动时,服务器需要更长的时间来响应,因为它必须编译您的应用程序并启动它。这可能需要相当长的时间。有几种解决方法,包括更改应用程序回收时间和单独的心跳服务,这些服务向应用程序发出微小的请求,只是为了使其在较长时间不活动期间保持事件状态。

您还应该考虑到您的开发页面正在桌面计算机上运行。您应该知道您的服务器是否更快。

所以也许这不是 session 创建,而是应用程序启动。您应该通过在浏览器中打开页面并等待其完成,然后关闭浏览器并再次打开它(以便创建新 session )并访问您的应用程序来区分差异。如果加载速度更快,那么这不是您的 session 的错误,而是 .net 框架必须编译您的应用程序时应用程序启动的错误。

首先定义问题,然后开始缓解

关于jquery - 如何在加载数据时创建页面叠加 - asp.net/jquery/blockui,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7901650/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com