AJAX应用代码
"Get" 方式请求, 不需要再服务器获取信息的时候使用Get请求方式即可 <script type="text/javascript"> var xhr=false; // 声明一个全局的异步对象 window.onload=function(){ xhr=new XMLHttpRequest();//创建异步对象 xhr.open("get","请求页面",true);//设置请求参数( 请求方式 , 请求页面 ,是否采用异步对象 ) xhr.setRequestHeader("If-Modified-Since",0);//设置浏览器请求页面时不使用缓存 xhr.onreadystatechange=function () { //设置回调函数 , 用户定义 ,系统调用 称为回调函数. if (xhr.readyState==4 && xhr.status==200){ var result=xhr.responseText; // 获取服务器输出的响应字符串信息 } }; xhr.send(null); //参数可以设置,可能会引起浏览器兼容问题 }; </script>
"Post" 方式请求, 需要在服务器获取异步对象处理请求时传递的客户端信息的时候使用Post请求方式即可 <script type="text/javascript"> var xhr=false; // 声明一个全局的异步对象 var userName = gel("txtName"); //用户名 var userPwd = gel("txtPwd"); //密码 var inputCode = gel("checkCode"); //验证码
window.onload=function(){ xhr=new XMLHttpRequest();//创建异步对象 xhr.open("Post","请求页面",true);//设置请求参数( 请求方式 , 请求页面 ,是否采用异步对象 ) xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");//设置请求头,表单Form默认的enctype类型 xhr.onreadystatechange=function () { //设置回调函数 , 用户定义 ,系统调用 称为回调函数. if (xhr.readyState == 4 && xhr.status == 200) { var msg = xhr.responseText;//获取从服务端返回的字符串信息 //对服务器返回的字符串 进行判断 if (msg == "OK") {//通过验证后 则跳转到首页 window.location = "Index.aspx"; } else if (msg == "Sorry") { ShowMsg("用户名或密码错误!"); } else if (msg == "errorCode") { ShowMsg("验证码错误"); } else { ShowMsg("错误"); } } else { ShowMsg("服务器维护中......"); } }; //post请求方式,在send的时候 必须将服务器端需要验证的信息传递过去,ispostback是判断用户是通过url进入页面,还是点击按钮进入 xhr.send("txtName="+userName.value+"&txtPwd=" + userPwd.value +"&checkCode="+inputCode.value+ "&ispostback=true"); }; </script>
