码迷,mamicode.com
首页 > Web开发 > 详细

怎么使用AJAX的GET和POST异步请求

时间:2017-11-18 18:40:53      阅读:160      评论:0      收藏:0      [点我收藏+]

标签:element   ajax   callback   fun   res   cat   ready   请求方式   sof   

1.创建XMLHttpRequest对象
var xmlHttp=createXMLHttpRequest();
function createXMLHttpRequest()

 var xmlHttp;
 if(Window.XMLHttpRequest)
 { 
  //IE6以上版本和其他浏览器内置XMLHttpRequest对象
  xmlHttp=new XMLHttpRequest();
 }
 else if(Window.ActiveXObject)
 {
  //在IE6及其以下浏览器可以通过ActiveXObject的两个控件来创建,将版本新的放在前面
  var activexName=["MSXML2.XMLHTTP", "Microsoft.XMLHTTP"];
  for(var i=0; i<activexName.length; i++)
  {
   try
   { //取出一个控件名进行创建,创建成功就终止循环
    xmlHttp=new ActiveXObject(activexName[i]);
    break;
   }
   catch(e){};
  }
 }
 //确认XMLHttpRequest对象创建成功
 if(!xmlHttp)
 {
  alert("XMLHttpRequest对象创建失败!");
  return;
 }
 else 
 {
  //alert(xmlHttp);
  return xmlHttp;
 }
}

2.注册回调函数
xmlHttp.onreadystatechange=callback;

3.初始化XMLHttpRequest对象,设置连接信息
//第一个参数表示http的请求方式,分为GET和POST两种,GET方式请求的参数在URL中
//第二个参数表示请求的url地址,该地址会被解析为绝对地址
//第三个参数表示请求方式是同步或是异步,默认是同步true,第四,五个参数通常不用
xmlHttp.open("GET",url, true);

4.发送数据,开始和服务器端进行交付
//同步方式下:send()这句话会在服务器端的数据传送回来后才执行完,再执行下一条语句
//异步方式下:send()这句话会立即执行完,接着执行下一条语句
//若以POST方式,需要自己设置http的请求头
//xmlHttp.open("POST",url,true);
//xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
//xmlHttp.send("name="+value);
xmlHttp.send(null); //该参数为可选,此时也可不写


5.定义回调函数,该函数主要负责接收从服务器端传回来的数据,并在页面上显示
function callback()
{
 //判断对象的交互状态是否完成
 if(xmlHttp.readyState==4)
 {
  //判断http的交互是否成功
  if(xmlHttp.status==200)
  {
   //获取服务器端返回的数据,以纯文本数据或xml文档格式的数据
   var responseText=xmlHttp.responseText;
   //将响应数据显示在页面上
   //以DOM方式或JQuery方式获取文档节点
   var divNode=document.getElementById("#divNode_ID");
   divNode.innerHTML=responseText;
  }
 }
 
}

怎么使用AJAX的GET和POST异步请求

标签:element   ajax   callback   fun   res   cat   ready   请求方式   sof   

原文地址:http://www.cnblogs.com/yanyufusu/p/7857411.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!