html利用ajax做进度条,在网页提交后显示进度条,和使用ajax的例子

我以前作的一个项目，因为提交请求在服务器端执行需要很长时间，大概需要10分多钟，客户总抱怨网页就像死机了一样，在切换到其他页面，重新切换回来时就成了白屏，死机一样，或者客户端干脆什么也干不了，一直没有解决掉现在看看了ajax的东西，做了一个象c/s模式的在提交后页面的出现一个顶层的进度条，显示进度情况。

刚开始不知道怎么做经过这两天，通过在网上找一些资料，做了一个例子，同时把cu登陆博客时，出现的那个进度条也直接拿过来用了，呵呵

，做出来的效果跟真的似的。

以下是网页的源码文件，还有css文件，这个和上次那个是一样的：

New Document

marginwidth="0" >

//对话框的html

class="id" style="display:none;">

提示信息

class="ik" value="确定-" />

//对话框的html

>

10

35

50

0

οnchange="document.forms['kf'].elements['bi'].selectedIndex=this.selectedIndex;SS(1,'x');RR();">

10

35

50

0

css文件：

td,p,li,input,select,div,span {font-size:12px;}

table,td,img,div,span,form{border: none;margin: 0 0 0 0;padding: 0 0 0 0;}

h1{display:none;}A img{border:none;}A:link {color:#00f;}

A:visited {color:#800080;}

A:active {color:#f00;}

A:hover {color:#f00;}#kh a:link,#kh a:visited,#kh2 a:link,#kh2 a:visited {text-decoration: none;color:#000;}

#kh a:active,#kh a:hover,#kh2 a:active,#kh2 a:hover {text-decoration: underline;color:#f00;}

#kh,#kh2{color:#000;}

#ie{float:left;

padding-top:3px;

font-weight:bold;

padding-left:15px;

width:360px;

cursor:move;

height:20px;

}

.ib{background-color:#000;

width:100%;

height:100%;

position:absolute;

top:0;

left:0;

z-index:49;

display:none;

filter:alpha(opacity=60);

-moz-opacity:0.6;

}

.id{

position:absolute;

z-index:50;

display:none;

background-color:#fff;

}

.ij{padding:10px 10px 10px 10px;width:370px;text-align:center;line-height:19px;}

开始的时候不知道什么原因，总不能正确显示对话框后在才发现原来是css没有设置，看来要在网页里做出一些东西还是要js和css都很熟练才行啊。以前只是做一些后台的东西对这些不懂，看来有时间还是要看看的了。