创建AJAX

最新推荐文章于 2023-10-23 20:53:33 发布

最新推荐文章于 2023-10-23 20:53:33 发布 · 65 阅读

本文详细介绍了使用AJAX进行异步数据交换的过程。主要内容包括创建XMLHttpRequest对象、设置回调函数、初始化并发送请求等关键步骤。此外，还展示了如何处理服务器响应，并根据响应结果执行相应的操作。

使用AJAX之前需要经过下面的步骤：

//声明全局对象 var xmlHttpRequest; function createXmlHttpRetuest(){ if(window.ActiveXObject){ try{ xmlHttpRequest = new ActiveXObject("Microsoft.XMLHTTP"); }catch(e){ xmlHttpRequest = new ActiveXObject("Msxml2.XMLHTTP"); } return xmlHttpRequest; }else if(window.XMLHttpRequest){ return new XMLHttpRequest(); } } function function1Name(){ //1.创建xmlHttpRequest对象 xmlHttpRequest = createXmlHttpRequest(); //2.设置回调函数 xmlHttpRequest.onreadystatechange = function2Name ; var url = "http://localhost:8080/${pageContext.request.contextPath}/ServletName?paramName" + document.getElementById("").value + "¶mName2=..." ; //alert(url); //3.初始化XMLHttpRequest组建 true-->设置异步 xmlHttpRequest.open("post",url,true); //设置不要浏览器缓存 xmlHttpRequest.setRequestHeader("if-Modified-Since","0"); //4.发送请求通常写为null xmlHttpRequest.send(null); } /* * 0--为初始化 * 1--初始化 * 2--发送请求 * 3--开始接受结果 * 4--接受结果完毕 * * xmlHttpRequest.readyState 状态改变一次回调函数就被调用一次 * 200----OK * 404---Not found(没有找到资源) * 500---服务器端出错 */ function function2Name(){ ...(操作) if(xmlHttpRequest.readyState == 4 && xmlHttpRequest.status == 200){ var rs = xmlHttpRequest.responseText ; if(rs == "true"){ alert(); operate... }ese{ alert(); operate... } } }