XMLHttpRequest实现登录验证

以上功能的纯XMLHttpRequest实现:

var xmlhttp;

function verify(){

   //0.使用dom的方式获取文本框中的值

   var username=document.getElementById("username").value;

   //1.创建XMLHttpRequest对象

    if(window.XMLHttpRequest){ 

    //针对FireFoxMozillarOperaSafariIE7,IE8

   xmlhttp=new XMLHttpRequest();

   //针对某些特定版本的mozillar浏览器的bug进行修正

    if(xmlhttp.overrideMimeType){xmlhttp.overrideMimeType("text/xml");}

    }else if(window.ActiveXObject){

        //针对IE6,IE5.5,IE5

        //两个可以用于创建XMLHttpRequest对象的控件名称,保存在一个js的数组中,排在前面的版本较新

        var activexName=["MSXML2.XMLHTTP","Microsoft.XMLHTTP"];

        for(var i=0;i

             try{

                    xmlhttp=new ActiveXObject(activexName[i]);

                    break;

                }catch(e){}

           }

    }

    //确认XMLHttpRequest对象创建成功

    if(!xmlhttp){

        alert("XMLHttpRequest创建失败");

 

    } else{alert(xmlhttp);}

 

    //2.注册回调函数

    xmlhttp.onreadystatechange=callback;

    //3.设置连接信息

    //true表示异步交互

    xmlhttp.open("GET","servlet/xx.aspx?name="+username,true);

    //4.发送数据,开始和服务器端进行交互

    xmlhttp.send(null);//null是因为参数在url

}

 

 

 

 

function callback(){

     5.接受响应数据

     //判断对象的状态是否交互完成

     if(xmlhttp.readyState==4){

            //判断http的交互是否成功

         if(xmlhttp.status==200){

             //获取服务器端返回的数据

             //获取服务器端输出的纯文本数据

             var responseText=xmlhttp.responseText;

             //将数据显示在页面上

             //通过dom的方式找到div标签所对应的元素节点

             var divNode=document.getElementById("result");

             //设置元素节点中的html内容

             divNode.innerHTML=responseText;

         }  

     }

 }

 

你可能感兴趣的:(网站开发)