• 软件测试技术
  • 软件测试博客
  • 软件测试视频
  • 开源软件测试技术
  • 软件测试论坛
  • 软件测试沙龙
  • 软件测试资料下载
  • 软件测试杂志
  • 软件测试人才招聘
    暂时没有公告

字号: | 推荐给好友 上一篇 | 下一篇

看看如何在Struts应用中施展AJAX魔法[3]

发布: 2008-1-29 13:37 | 作者: 不详 | 来源: 赛迪网 | 查看: 8次 | 进入软件测试论坛讨论

领测软件测试网 function retrieveURL(url,nameOfFormToPost) {

//将url转换成字符串

url=url+getFormAsString(nameOfFormToPost);

//调用AJAX

if (window.XMLHttpRequest) {

// 非IE浏览器

req = new XMLHttpRequest();

req.onreadystatechange = processStateChange;

try {

req.open("GET", url, true);

} catch (e) {

alert("Server Communication Problem\n"+e);

}

req.send(null);

} else if (window.ActiveXObject) {

// IE

req = new ActiveXObject("Microsoft.XMLHTTP");

if (req) {

req.onreadystatechange=processStateChange;

req.open("GET", url, true);

req.send();

}

}

}

getFormAsString() 是一个“私有” 方法,在retrieveURL()中使用。

function getFormAsString(formName){

//设置返回字符串

returnString ="";

//取得表单的值

formElements=document.forms[formName].elements;

//循环数组,组装url

//像'/strutsaction.do&name=value'这样的格式

for(var i=formElements.length-1;i>=0; --i ){

//转化每一个值

returnString+="&"

+escape(formElements[i].name)+"="

+escape(formElements[i].value);

}

//返回字符串

return returnString;

}

根据AJAX的响应更新web页面

到现在为止,我们学习过了使用JavaScript来完成AJAX调用(前面列出),Struts Action,ActionForm以及JSP(基本没有变化,只是增加了标签)。为了完善我们对Struts-AJAX项目的了解,我们需要了解三个用于根据服务器返回的结果而更新页面的JavaScript方法。

· processStateChange(): 该方法在AJAX调用前设定。它在服务器响应到达后由XMLHttpRequest/Microsoft.XMLHTTP 对象调用。

·splitTextIntoSpan(): 根据响应,循环取出数组中的元素组装成NewContent。

·replaceExistingWithNewHtml(): 根据span元素数组,循环搜索,将里面的元素调换掉页面中和它的'someName'相同的中的内容。注意,我们使用的是req.responseText 方法来获得返回的内容(它允许我们操作任何文本的响应)。与此相对于的是req.responseXml (它的作用更大,但是要求服务器返回是XHTML或者XML)。

function processStateChange() {

if (req.readyState == 4) { // 完成

if (req.status == 200) { // 响应正常

//将响应的文本分割成Span元素

spanElements =

splitTextIntoSpan(req.responseText);

//使用这些Span元素更新页面

replaceExistingWithNewHtml(spanElements);

} else {

alert("Problem with server response:\n "

+ req.statusText);

}

}

}

replaceExistingWithNewHtml() 是为processStateChange()使用的“私有”方法。

function replaceExistingWithNewHtml

(newTextElements){

//循环newTextElements

for(var i=newTextElements.length-1;i>=0;--i){

//判断是否以 if(newTextElements[i].

indexOf("-1){

//获得span的名字- 设置在第一和第二个引号之间

//确认span元素是以下的格式

//NewContent

startNamePos=newTextElements[i].

indexOf('"')+1;

endNamePos=newTextElements[i].

indexOf('"',startNamePos);

name=newTextElements[i].

substring(startNamePos,endNamePos);

//获得内容-在第一个>标记后的所有内容

startContentPos=newTextElements[i].

indexOf('>')+1;

content=newTextElements[i].

substring(startContentPos);

//现在更新现有的Document中的元素,

// 确保文档存在该元素

if(document.getElementById(name)){

document.getElementById(name).

innerHTML = content;

}

}

}

splitTextIntoSpan() 是为processStateChange() 使用的“私有”方法。

function splitTextIntoSpan(textToSplit){

//分割文档

returnElements=textToSplit.

split("")

//处理每个元素

for(var i=returnElements.length-1;i>=0;--i){

//删除掉第一个span后面的元素

spanPos = returnElements[i].

indexOf("

//如果找到匹配的,获得span前的内容

if(spanPos>0){

subString=returnElements[i].

substring(spanPos);

returnElements[i]=subString;

}

}

return returnElements;

}

文章来源于领测软件测试网 https://www.ltesting.net/

TAG: AJAX魔法


关于领测软件测试网 | 领测软件测试网合作伙伴 | 广告服务 | 投稿指南 | 联系我们 | 网站地图 | 友情链接
版权所有(C) 2003-2010 TestAge(领测软件测试网)|领测国际科技(北京)有限公司|软件测试工程师培训网 All Rights Reserved
北京市海淀区中关村南大街9号北京理工科技大厦1402室 京ICP备10010545号-5
技术支持和业务联系:info@testage.com.cn 电话:010-51297073

软件测试 | 领测国际ISTQBISTQB官网TMMiTMMi认证国际软件测试工程师认证领测软件测试网