Ajax的简单使用

对于常见的Ajax使用，大概过程如下

1.创建xmlhttpRequest对象

function createXMLHttpRequest（）{

if(window.XMLHttpRequest){

xmlhttp=new XMLHttpRequest();//除去所有ie以外的浏览器

}else if(wingdow.ActiveXObject){

try{ xmlhttp=new ActiveXObject("Msxm12.XMLHTTP");//比较新版的ie浏览器

}catch(e){ try{ xmlhttp=new ActiveXObject("miscrosoft.XMLHTTP");//老版ie浏览器

} catch(e){}}

}

}

2.创建对象成功后，创建请求发送函数

sendRequest（url）{

createXMLHttpRequest（）；

xmlhttp.open("get",url,true);

xmlhttp.onreadystatechange=processResponse;//结果响应函数，直接等上去即可

xmlhttp.send(null);//发送请求，如果是get的的话不用发送参数

}

3.完成上面两步后，创建响应函数

processResponse（）{

//当readyState=4的时候，表明XMLHttpRequest创建完成

if(xmlhttp.readyState==4){

//当status=200的时候说明处理结果的信息成功返回了

if(xmlhttp.status==200){

var res=xmlhttp.responsexml.getElementsByTagName("res")[0].firstChild.date;//获取servlet中以xml格式显示的响应结果

//这里可以是很多处理res的方法。比如说自动刷新加一个setTimeout("sendRequest",1000);//按指定的时间重复执行发送函数

//也可以是你想让他如何进行显示，自己编一个函数等等

//当然他还可以返回字符串 var res=xmlhttp.responseText;//返回servlet要显示的字符串

}else{

// 页面不正常

alert（“页面不正常”）

}

}

}

4.如何触发车个sendRequest（url）函数

当点击某个按钮时，进行触发这个函数

function check（）{

var name=document.form.username.value;

var pass=document.form.password.value;

if(name==""){

alert("用户名不能为空");

document.dorm.username.focus();

return false;

}else{

sendRequest("login?username="+name+"&passwoerd="+pass)

}

}

5.创建一个jsp页面

<form action="login.jsp" method="post" name="form">

<input type="text" name="username" value="">

<input type="password" name="password" value="">

<input type="submit" value=“提交" onclic="check();">

</form>

6.创建结果返回到控制器servlet时，规定他的显示格式，以便让响应函数processRespnse（）获得

省略部分代码

doGet(req,res){

req.setCharacterEncoding("UTF-8");//设置请求字符串编码

//接收发送过来的数据

String username=request.getParameter("username");

String pass=requst.getParameter("password");

//设置显示信息的格式以及字符集

res.setContentType("text/xml;charset=UTF-8");

res.setHeader("Cache-Control","no-cache");//清楚客户端（浏览器）的缓存

//获得输出流

PrintWriter out =response.getWriter();

out.println("<response>");

if(username.equals("mm")&&pass.equals("www")){

out.println("<res>"+内容+”</res>“);//里面的内容是响应函数processResponse（）所获取的 ，通过操作DOM

}else{

out.println("<res>"+另外的内容+"</res>");

}

out.println("</response>");

out.close();//关闭输出流

}

以上大概就是jax操作的简单过程了，如果要做出更绚烂的效果，那还要。。。。。

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!