Ajax学习和例子.docVIP

ajax是什么 ？ ajax(asynchronouse javascript and xml) 异步的javascript 和 xml 是7种技术的综合,它包含了七个技术( javascript xml xstl xhtml dom xmlhttprequest , css), ajax 是一个粘合剂, ajax是一个与服务端语言无关的技术. 即可以使用在(php/java ee/.net网站/ asp) ajax可以给客户端返回三种格式数据(文本格式 ，xml , json格式) 无刷新数据交换技术有以下: flash, java applet, 框架, iframe, ajax) ajax 的运行原理分析 看一个需求: ajax在什么地方用的多 1 动态加载数据，按需取得数据。【树形菜单、联动菜单.../省市联动】 2 改善用户体验。【输入内容前提示、带进度条文件上传...】 3 电子商务应用。 【购物车、邮件订阅...】 4 访问第三方服务。 【访问搜索服务、rss阅读器】 5. 数据的布局刷新 经典的案例 使用ajax与服务器通信的的步骤 创建一个XMLHttpRequest对象 创建url,data,通过 xmlHttpRequest.send() 服务器端接收 ajax的请求,做相应处理(操作数据库)，然后返回结果(echo 语句) 客户端通过xmlHttpRequest的属性 reponseText , responseXML 取的数据，然后就完成局部刷新当前页面任务 使用 ajax完成用户名的验证 register.php html head title用户注册/title meta http-equiv=content-type content=text/html;charset=utf-8/ script type=text/javascript //创建ajax引擎 function getXmlHttpObject(){ var xmlHttpRequest; //不同的浏览器获取对象xmlhttprequest 对象方法不一样 if(window.ActiveXObject){ xmlHttpRequest=new ActiveXObject(Microsoft.XMLHTTP); }else{ xmlHttpRequest=new XMLHttpRequest(); } return xmlHttpRequest; } var myXmlHttpRequest=; //验证用户名是否存在 function checkName(){ myXmlHttpRequest=getXmlHttpObject(); //怎么判断创建ok if(myXmlHttpRequest){ //通过myXmlHttpRequest对象发送请求到服务器的某个页面 //第一个参数表示请求的方式, get / post //第二个参数指定url,对哪个页面发出ajax请求(本质仍然是http请求) //第三个参数表示 true表示使用异步机制,如果false表示不使用异步 var url=/ajax/registerProcess.php?mytime=+new Date()+username=+$(username).value; //打开请求. myXmlHttpRequest.open(get,url,true); //指定回调函数.chuli是函数名 myXmlHttpRequest.onreadystatechange=chuli; //真的发送请求,如果是get请求则填入 null即可 //如果是post请求，则填入实际的数据 myXmlHttpRequest.send(null); } } //回调函数 function chuli(){ //window.alert(处理函数被调回+myXmlHttpRequest.readyState); //我要取出从registerPro.php页面返回的数据 if(myXmlHttpRequest.readyState==4){ //取出值,根据返回信息的格式定.text //window.alert(服务器返回+myXmlHttpRequest.responseText); $(myres).value=myXmlHttpRequest.responseText; } } //这里我们写一个函数 function $(id){