对于常见的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>");
}
以上大概就是jax操作的简单过程了,如果要做出更绚烂的效果,那还要。。。。。