跟我学ajax技术——如何应用ajax技术实现实时任务进度条的web应用示例（第四部分）

《跟我学ajax技术——如何应用ajax技术实现实时任务进度条的web应用示例（第四部分）》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、杨教授工作室精心创作的优秀程序员职业提升必读系列资料1.1跟我学AJAX技术——如何应用AJAX技术实现实时任务进度条的Web应用示例（第四部分）1.1.1采用面向对象的方式进行本示例中的JavaScript编程实现1、将javascript目录中的taskProgressBar.js文件修改为如下的代码varcurrentTotalBarAmount="";varrequestServerURL;varrequestParameters;functionsendAsynchronousRequest(requestServerU

2、RLString,requestParametersString){/***由于本示例需要在定时器的回调函数中再次获得requestServerURL请求URL和requestParameters*请求的查询参数字符串，因此需要将它们加以缓存*/requestServerURL=requestServerURLString;requestParameters=requestParametersString;/***创建XMLHttpRequest请求对象和发送最终的异步请求*/createXMLHttpRequestAndSend

3、Request();}functioncreateXMLHttpRequestAndSendRequest(){/***创建AJAXObjectTemplate对象模板的对象实例，并传递相关的AJAX工作参数。*其中第3个参数为可选参数，代表请求的方式，默认为post请求*/varoneAJAXObjectTemplateInstance=newAJAXObjectTemplate(requestServerURL,requestParameters,"post","xml");9杨教授工作室，版权所有，盗版必究，9/9页杨教授工

4、作室精心创作的优秀程序员职业提升必读系列资料/***创建XMLHttpRequest请求对象实例，并构建出请求参数，最终发送异步请求。*并将获得服务器端程序返回值的回调函数传给该函数*/oneAJAXObjectTemplateInstance.buildAndSendXMLHttpRequest(showCurrentTaskProgress);}/****参数xmlDOMReturnResult代表服务器端相关程序返回的XML格式的处理结果*/functionshowCurrentTaskProgress(xmlDOMRetu

5、rnResult){/**根据传递的服务器端程序返回的XML文档数据所对应的DOM对象，从中获得XML文档中指定标签名称的标签中所包含的数据，该数据为任务进度量*/varbarConterValue=xmlDOMReturnResult.getElementsByTagName("currentPercent")[0].firstChild.data;currentTotalBarAmount=currentTotalBarAmount+"

6、

7、";document.getElementById("displayLoadingCha

8、rtTextID").innerHTML="载入中..."+currentTotalBarAmount;document.getElementById("displayPercentValueTextID").innerHTML=barConterValue+"%";if(barConterValue>99){/***任务结束时自动跳转到目标页面中，目前没有定义出具体的URL*/window.location.href="#";}9杨教授工作室，版权所有，盗版必究，9/9页杨教授工作室精心创作的优秀程序员职业提升必读系列资料els

9、e{/***每隔1秒钟再次向服务器端相关程序发送查询新的任务完成量的请求，继续执行*createXMLHttpRequestAndSendRequest函数*/setTimeout("createXMLHttpRequestAndSendRequest();",1000);}}2、再在javascript目录中新建一个名称为ajaxObjectTemplate.js文件/***封装AJAX的一个对象模板，但需要定义两个全局对象（因为AJAX中的请求回调是异步形式），初始创建的*XMLHttpRequest对象已经销毁，为此通过全局

10、对象才能缓存在请求中所创建的XMLHttpRequest对象：*xmlHttpRequest_global为XMLHttpRequest对象，*sendResponseResultToClientCallBackFunction为对服务器端程序返回