创建ajax及用法,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页面

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("");

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

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

}else{

out.println(""+另外的内容+"");

}

out.println("");

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

}

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

总结

以上是编程之家为你收集整理的Ajax的简单使用全部内容，希望文章能够帮你解决Ajax的简单使用所遇到的程序开发问题。

如果觉得编程之家网站内容还不错，欢迎将编程之家网站推荐给程序员好友。

本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。