0

我有一个 Home.html,它有一个登录表单,该表单发布到 login.aspx,login.aspx 需要花费大量时间来加载......

所以我想要一个基于javascript的函数,在我点击登录按钮的那一刻,必须显示一个加载器......而在后台发生POST,然后必须加载aspx页面,然后模式必须重定向到aspx页面。

类似于 gmail.com 登录加载器.....但仅使用 javascript。(我也在使用缩小的 jquery js)(中间没有 aspx 页面)

请注意,我不能使用任何基于 asp 的加载器!

我试过使用:

http://blogs.msdn.com/naitik/archive/2008/07/31/show-loading-message-while-web-page-is-processing.aspx
(它运行不快。它首先重定向到 POST页 )

提前致谢..

4

2 回答 2

0

如果您只想显示“请稍候...”,请将自己附加到表单“onsubmit”事件。然后显示“请稍候”消息(使 DIV 可见)。完成后,表单将被提交并等待 login.aspx。

如果你想要一个进度条,你有两种方法: * 要么发布到一个隐藏的 iframe,它会加载 login.aspx。* 或使用 XmlHttpRequest 加载 login.aspx。

在这两种情况下,login.aspx 都必须输出更新进度条的消息(您在客户端解释的 JScript 或 DIV 片段)。

您会在 Google 中找到大量示例。例如,尝试“jscript 进度条 aspx”。

勒内

于 2010-08-19T13:14:21.277 回答
0

Check out the following link, as it is the needed code, styling and layout for a "Loader".

I have used the code and it works 100%

You need a Div on your page:

 <div class="modal"></div>

a bit of CSS styling for the div:

/* Start by setting display:none to make this hidden.
Then we position it in relation to the viewport window
with position:fixed. Width, height, top and left speak
speak for themselves. Background we set to 80% white with
our animation centered, and no-repeating */
.modal {
    display:    none;
    position:   fixed;
    z-index:    1000;
    top:        0;
    left:       0;
    height:     100%;
    width:      100%;
    background: rgba( 255, 255, 255, .8 ) 
                url('http://sampsonresume.com/labs/pIkfp.gif') 
                50% 50% 
                no-repeat;
 }

 /* When the body has the loading class, we turn
    the scrollbar off with overflow:hidden */
 body.loading {
     overflow: hidden;   
 }

 /* Anytime the body has the loading class, our
    modal element will be visible */
 body.loading .modal {
      display: block;
 }

And then lastly a bit of javascript to start and stop(hide and display) the loader:

START:

 $(this).addClass("loading");

STOP:

 $(this).removeClass("loading");

Source: http://jsfiddle.net/jonathansampson/VpDUG/170/

于 2013-02-27T13:07:58.330 回答