第一次写“等待中”代码
在一个web页面，点击一个按钮后运行程序，它的执行很慢，在此时希望有一个友好的提示：------执行中，请等待！！----
1 这个等待的程序怎么写？求具体代码
2 怎么知道什么时候程序执行完，这个提示就自动结束？
在一个web页面，点击一个按钮后运行程序，它的执行很慢，在此时希望有一个友好的提示：------执行中，请等待！！----
1 这个等待的程序怎么写？求具体代码
2 怎么知道什么时候程序执行完，这个提示就自动结束？
一般我们是定义一个层来控制显示的字，比如：<div id="outer" style=" width:160px; height:auto;position:absolute;display: none;">
<font style=" font-size: 24px; " color="#0000ff">：------执行中，请等待！！---- </font>
然后在你的显示的页面里面定义一个funcition()函数：
function showWait(){
var scrollHeight;
var scrollWidth;
if (typeof window.pageYOffset != 'undefined') {
scrollHeight = window.pageYOffset;
scrollWidth = window.pageXOffset;
}
else if (typeof document.compatMode != 'undefined' && document.compatMode != 'BackCompat') {
scrollHeight = document.documentElement.scrollTop;
scrollWidth = document.documentElement.scrollLeft;
}
else if (typeof document.body != 'undefined') {
scrollHeight = document.body.scrollTop;
scrollWidth = document.body.scrollLeft;
}
showdiv = document.getElementById("outer");
showdiv.style.display = "block";
showdiv.style.left = (scrollWidth+(screen.width-160)/2)+"px";
showdiv.style.top = (scrollHeight+(screen.height-48)/2)+"px";
}，最后就是在你点击一个按钮后运行程序时，得先执行这个函数，字就会显示出来了，当你的结果出来以后，这几个字就会自动消失了，直到你再次点击按钮！
用xmlhttp异步请求技术,在发往服务器请求数据且数据没有到达时写上请等待这些的代码,写法可参考二楼写的,当数据到达时用js代码来对数据进行处理,以下给你写个简单的模板:
<script type="text/javascript">
var xmlhttp = null;
function createXmlHttp(){
if(xmlhttp == null){
//创建xmlhttp对象,你可以去网上搜索,这类代码很多的,建议最好找能支持多浏览器的
xmlhttp = new XmlHttp();
}
return xmlhttp;
}
function postData(url,data,processData){//processData是一个回调函数,用来处理返回来的数据
createXmlHttp();
xmlhttp.open(url,true);//异步请求数据,也可以采取同步,同步时则只能返回来数据时才可操作
xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xmlhttp.onreadystatechange = function () {
if(xmlhttp.readyState == 3){
//此处参数二楼写的等待函数执行
}
if (xmlhttp.readyState == 4) {
processData(xmlhttp.responseText);//处理服务器端返回来的数据
}
}
xmlhttp.send(data); //向服务器提交数据
}
//写你自己的代码来调用postData函数来执行吧,别忘了再一个回调函数啊,如果只想写一个的话则可以这样:
function postMyData(url,data){
//url,将要把数据提交到的url地址,即服务器上的一个服务,可以处理你所提交的数据,并把响应返回来
//待提交的数据
//这些都准备好后,就调用postData函数
postData(url,data,function(responseData){
//此处编写处理服务器端返回来的数据代码
});
}
</script>
///////////////////////////////////////////////////////
var m_wndWait4Me=window.createPopup();
var m_PopupDisplayFlag=true;
var m_message = "";
function showWait4MeWindow(message)
{
var processBarDisplayFlag = "true";
if (document.all.processBarDisplayFlag != undefined)
processBarDisplayFlag = document.all.processBarDisplayFlag.value;
if(m_PopupDisplayFlag==false || processBarDisplayFlag == 'false')
{
m_wndWait4Me.hide();
return;
}
var nWidth=310;
var strHtml ="";
//方案1
strHtml+="<table border=1 cellpadding=0 style='border-collapse: collapse' cellspacing=0 width=300 bordercolorlight='#C0C0C0' bordercolordark='#666699'>";
strHtml+="<tr><td width=100% >";
strHtml+="<table border=1 cellpadding=0 style='border-collapse: collapse' cellspacing=0 width=100% bordercolorlight='#FFFFFF' bordercolordark='#666699'>";
strHtml+="<tr><td width=100% >";
strHtml+="<table border='0' width=100% style='border-collapse: collapse' cellpadding=0 cellspacing=0 height=31>";
strHtml+="<tr><td width='100%' bgcolor='#000080' height='18'><b><font color='#FFFFFF' size='2'>正在处理数据，请稍等</font></b></td></tr>";
strHtml+="<tr><td width='100%' bgcolor='menu' height='13'> </td></tr> ";
strHtml+="<tr> <td align='center' width='100%' bgcolor='menu' height='23'>";
strHtml+="<marquee style='border:1px solid #6699CC' direction='right' width='280' scrollamount='5' scrolldelay='10' bgcolor='#ECF2FF'>";
strHtml+="<table cellspacing='1' cellpadding='0'><tr height=8><td bgcolor=#3399FF width=8></td><td></td><td bgcolor=#3399FF width=8></td><td></td><td bgcolor=#3399FF width=8></td><td></td><td bgcolor=#3399FF width=8></td><td></td></tr></table></marquee>";
strHtml+="</tr>";
strHtml+="<tr><td width='100%' bgcolor='menu' height='13'> </td></tr> ";
strHtml+="</table>";
strHtml+="</td></tr></table></td></tr></table>";
//方案2
//strHtml+="<table border=1 cellpadding=0 style='border-collapse: collapse' cellspacing=0 width=300 bordercolorlight='#C0C0C0' bordercolordark='#666699'>";
//strHtml+="<tr><td width=100% >";
//strHtml+="<table border=1 cellpadding=0 style='border-collapse: collapse' cellspacing=0 width=100% bordercolorlight='#FFFFFF' bordercolordark='#666699'>";
//strHtml+="<tr><td width=100% >";
//strHtml+="<table border='0' width=100% style='border-collapse: collapse' cellpadding=0 cellspacing=0 height=31>";
//strHtml+="<tr><td width='100%' bgcolor='#000080' height='18'><b><font color='#FFFFFF' size='2'>正在处理数据，请稍等</font></b></td></tr>";
//strHtml+="<tr><td width='100%' bgcolor='menu' height='13'> </td></tr> ";
//strHtml+="<tr> <td width='100%' bgcolor='menu' height='13'> <font size=2><p align='left' id=TIMEA>  请稍等 "+message+"</font></td> </tr>";
//strHtml+="<tr><td width='100%' bgcolor='menu' height='13'> </td></tr> ";
//strHtml+="</table>";
//strHtml+="</td></tr></table></td></tr></table>";
//方案3
//strHtml = "<table width='300' border=\"0\" cellspacing=\"0\" cellpadding=\"0\" id=\"loaderContainer\" onClick=\"return false;\"><tr><td id=\"loaderContainerWH\"><div id=\"loader\"><table border=\"0\" cellpadding=\"0\" cellspacing=\"0\" width=\"100%\" style='font-size:9pt'><tr><td><p><img src=\"/images/loading.gif\" height=\"32\" width=\"32\" alt=\"\"/><strong>请稍候。<br>正在加载…</strong></p></td></tr></table></div></td></tr></table>";
m_wndWait4Me.document.body.innerHTML = strHtml;
var popupBody = m_wndWait4Me.document.body;
m_wndWait4Me.show(0, 0,nWidth , 0);
var realHeight = popupBody.scrollHeight;
m_wndWait4Me.hide();
m_wndWait4Me.show(200,200,nWidth,realHeight,document.body);
}
//showWait4MeWindow("123");var bar = 0
var line = "|"
var amount =""
//count() ;function count(){
bar= bar+2
amount =amount + line
//document.loading.chart.value=amount
if (bar<35)
{
}
else
{
bar=0;
amount="";
}
showWait4MeWindow(amount);
setTimeout("count()",500);
}
function showProcessBar(){
m_PopupDisplayFlag=true;
document.all.processBarDisplayFlag.value = "true";
count();
}function showStaticProcessBar() {
m_PopupDisplayFlag=true;
showWait4MeWindow("");
}function stopStaticProcessBar() {
m_PopupDisplayFlag=false;
showWait4MeWindow("");
}
///////////////////////////////////////////////////////////////////
测试页面processBar.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script language=JavaScript src="./processbar.js"></SCRIPT>
</head><body>
<INPUT type=hidden value=true name=processBarDisplayFlag>
<SCRIPT language=javascript>
document.all.processBarDisplayFlag.value="true";
showProcessBar();
</SCRIPT>
<font coloro="red">you can write your programe here</font>
<SCRIPT language=javascript>
document.all.processBarDisplayFlag.value="false";
</SCRIPT>
</body>
</html>
////////////////////////////////////////////////