xmlhttprequest对象的创建

来源:互联网 发布:内存整型数据 编辑:程序博客网 时间:2024/05/17 08:15

var xmlHttpRequest;
//用户名校验
//这个方法将使用XMLHTTPRequest对象来进行AJax的异步数据交互
function veryfy(){
 //1.使用dom的方式获取文本框的内容
 //document.getElementById("userName").value是dom中获取元素节点的value的属性值
 //var userName = document.getElementById("userName").value;
 //2.创建XMLHttpRequest对象
 //针对不同IE和其他浏览器这个对象的不同方式写不同的代码
 if(window.XMLHttpRequest){
  //针对Firefox、Mozillar、Opera、Safari、IE7、IE8.
   xmlHttpRequest = new XMLHttpRequest();
  //针对某些特定版本的mozillar浏览器的bug进行修改
  if(xmlHttpRequest.overrideMimeType){
   xmlHttpRequest.overrideMimeType("text/html");
  }
 }else if(window.ActiveXObject){
  //针对IE6,IE5.5,IE5
  //两个可以用于创建XMLHTTPRequest对象的控件名称,保存在一个js数组当中
  //排在前面的版本较新
  var activexName = ["MSXML2.XMLHTTP","Microsoft.XMLHTTP"];
  for(var i=0;i<activexName.length;i++){
   try{
    //取出一个控件名进行创建,如果创建成功就终止循环
    //如果创建失败,会抛出异常,然后可以继续循环,继续尝试创建
     xmlHttpRequest = new ActiveXObject(activexName[i]);
    break;
   }catch(e){
   }
  }
 }
 //2.注册回调函数(只需函数名),而不是赋予函数的返回值
 xmlHttpRequest.onreadystatechange = callback;
 //3.设置连接信息
 xmlHttpRequest.open("GET","AjaxServer?name="+userName,true);
 //4.发送数据,开始和服务器端进行交互
 xmlHttpRequest.send(null);
 // 同步和异步的区别:
 //同步方式下:send会在服务器端返回数据之后才会执行完
 //异步方式下:send会立即执行
}
//回调函数
function callback(){
 //判断对象的状态是否交互完成
 if(xmlHttpRequest.readyState == 4){
  //判断http的交互是否成功
  if(xmlHttpRequest.status == 200){
   //获取服务器返回的数据
   var responseText = xmlHttpRequest.responseText;
   //将数据显示在页面上
   //通过dom的方式找到div标签所对应的节点上
   var divNode = document.getElementById("result");
   divNode.innerHTML = responseText;
  }
 }
}

原创粉丝点击