// 定义一个全局的XMLHttpRequest对象 var xmlHttpRequest; function verify() { var userName = document.getElementById("userName").value; // 创建XMLHttpRequst对象 // 需要这对IE核其他类型的浏览器建立这个对象的不同方法写不同的代码 if (window.XMLHttpRequest) { // 针对FireFox,Mozilla,Opera,Safari,IE7,IE8 xmlHttpRequest = new XMLHttpRequest(); // 针对某些特定版本的Mozilla浏览器的BUG进行修正 try { if (xmlHttpRequest.overrideMimeType()) { xmlHttpRequest.overrideMimeType("text/xml"); } } catch (e) { } } else if (window.ActiveXObject) { // 针对IE6,IE5.5,IE5 // 两个可以用于创建XMLHTTPRquest对象的控件名称,保存在一个js的数组中 // 排在前面的版本比价新 var activexName = ["MSXML2.XMLHTTP", "Microsoft.XMLHTTP"]; for (var i = 0; i < activexName.length; i++) { try { // 取出一个控件名进行创建,如果创建成功就终止循环 // 如果创建失败,会抛出异常,然后可以继续循环,继续尝试创建 xmlHttpRequest = new ActiveXObject(activexName[i]); break; } catch (e) { } } } // 确认XMLHttpReques对象创建成功 if (!xmlHttpRequest) { alert("XMLHttpRequest对象创建失败!!"); return; } else { // 2.注册回调函数 // 注册毁掉函数时,只需要函数名不需要加括号 // 我们需要将函数名注册,如果加上括号,就会把函数的返回值注册上,这是错误的 xmlHttpRequest.onreadystatechange = callback; // 3.设置连接信息 // 第一个参数表示http的请求方式,支持所有的饿http的请求方式,主要使用get核post // 第二个参数表示请求的url路径 // 第三个参数表示采用同步还是异步,true表示异步 //xmlHttpRequest.open("GET", "AJAX?name=" + userName, true); //POST方式请求的代码 xmlHttpRequest.open("POST","AJAX",true); //POST方法需要自己设置http请求头 xmlHttpRequest.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); // 4发送数据,开始与服务器端交互 // 同步方式下,send这句话会在服务器端数据回来之后执行 // 异步方式下,send这句话会立即完成执行 //get方式的send方法参数为空 //xmlHttpRequest.send(null); //post方式的send方法参数为你要传递的url参数 xmlHttpRequest.send("name="+userName); } } // 5.回调函数 function callback() { // 判断对象的状态是否交互完成 if (xmlHttpRequest.readyState == 4) { // 判读http的交互是否成功 if (xmlHttpRequest.status == 200) { // 获取服务器端的返回数据 var responseText = xmlHttpRequest.responseText; // 将数据显示在页面上 // 通过dom方式找到dom对应的节点 var divResult = document.getElementById("result"); divResult.innerHTML = responseText; } } }