当前位置:编程学习 > php >>

AJAX实现用户名验证

[php]  
//该文件为register.php,在客户端  
<html>  
<head>  
<title>用户注册</title>  
<meta http-equiv = "content-type" content = "text/html;charset=utf-8"/>  
<script type = "text/javascript" >  
    //创建ajax引擎  
    function getXmlHttpObject(){  
        var xmlHttpRequest;  
        //不同浏览器获取对象XmlHttpRequest对象方法不同  
        if(window.ActiveXObject){  
            xmlHttpRequest = new ActiveXObject("Microsoft.XMLHTTP");  
        }else{  
            xmlHttpRequest = new XMLHttpRequest();  
        }  
        return xmlHttpRequest;  
    }  
    /* 
    function getXmlHttpObject(){ 
        //不同浏览器获取对象XmlHttpRequest对象方法不同 
        var xmlHttp = null; 
        try{ 
            //Firefox, Opera 8.0+, Safari 
            xmlHttp = new XMLHttpRequest(); 
        }catch(e){ 
            //Internet Explorer 
            try{ 
                xmlHttp = new ActiveXObject("Msxml2.XMLHTTP"); 
            }catch(e){ 
                xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); 
            } 
        } 
        return xmlHttp; 
    } 
    */  
      
    var myXmlHttpRequest = "";  
    //验证用户名是否存在  
    function checkName(){  
        //1号线  
        myXmlHttpRequest = getXmlHttpObject();  
  
        //判断创建成功?  
        if(myXmlHttpRequest){  
            //通过myXmlHttpRequest对象发送请求到服务器的某个页面  
            //第一个参数表示请求的方式, "get"/"post"  
            //第二个参数指定url,对哪个页面发出ajax请求(本质仍然是HTTP请求)  
            //第三个参数.true表示使用异步机制,false表示不使用异步机制  
              
            //注意:此处如果"username"和"="之间有空格,否则会出错,在服务器端接收不到"username";  
            //注意:如果"="之后有空格则将此空格也作为接收到的username的值的一部分。  
            //即在服务器端收到的username的值=“ ”(即空格)+从客户端发送的username值。  
            var url = "/AjaxTest/registerProcess.php?username=" + $("username1id").value;  
            //window.alert(url);  
              
            //打开请求  
            myXmlHttpRequest.open("get",url,true);  
            //指定回调函数.process是个函数名  
            myXmlHttpRequest.onreadystatechange = process;  
  
            //真正发送请求。如果是get请求则填入null即可  
            //如果是post请求,则填入实际的数据  
            //2号线  
            myXmlHttpRequest.send(null);              
              
        }  
    }  
  
    //回调函数  
    function process(){  
        //window.alert("这是回调函数" + myXmlHttpRequest.readyState);  
        //我要取出从registerProcess.php页面返回的数据  
          
        if(myXmlHttpRequest.readyState == 4){  
              
            //取出值,根据返回信息的格式而定  
            //window.alert("服务器返回" + myXmlHttpRequest.responseText);  
            //4号线  
            $('myResponse').value = myXmlHttpRequest.responseText;  
        }  
          
    }  
      
    function $(id){  
        return document.getElementById(id);  
    }  
</script>  
</head>  
<body>  
    <form action = "" method = "post">  
        用户名:<input type = "text" name = "username1" id = "username1id" >  
            <input type = "button" onclick = "checkName();"  value = "验证用户名">  
            <input style = "border-width: 0; color: red" type = "text" id = "myResponse">  
            <br/>  
        密码:<input type = "password" name = "password"><br/>  
        电子邮件:<input type = "text" name = "email"><br/>  
        <input type = "submit" value = "用户注册">  
    </form>  
    <form action = "" method = "post">  
        用户名:<input type = "text" name = "username2" >  
              
            <br/>  
      &nbs
补充:Web开发 , php ,
CopyRight © 2022 站长资源库 编程知识问答 zzzyk.com All Rights Reserved
部分文章来自网络,