AJAX 检测用户名是否存在

发布时间：2020-12-16 01:50:06 所属栏目：百科来源：网络整理

导读：首先要了解AJAX的工作原理 AJAX工作原理： 1：HTML页面(触发)——-javascript脚本（执行）—– PHP文件(反应)——–javascript脚本（返回）—–HTML页面(展示) 验证用户名源码： index.html !DOCTYPE html PUBLIC '-//W3C//DTD HTML 4.01 Strict//EN' 'http:

首先要了解AJAX的工作原理

AJAX工作原理：

1：HTML页面(触发)——->javascript脚本（执行）—–>
PHP文件(反应)——–>javascript脚本（返回）—–>HTML页面(展示)

验证用户名源码：

index.html

<!DOCTYPE html PUBLIC '-//W3C//DTD HTML 4.01 Strict//EN' 'http://www.w3.org/TR/html4/strict.dtd'>
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=utf-8'>
<title>insert into title</title>
<script type="text/javascript" src="ajax.js"></script>
</head>
<body>
       <form method="get" name="myform" enctype="multipart/form-data">
            用户：<input type="text" name="user" id="user" onblur="showName(this.value)"><br>
               <div name="txtint" id="txtint" style="width:200px;height:20px;"></div>
            密码：<input type="password" name="pass" id="pass" style="width:149px;"><br>
       </form>

</body>
</html>

ajax.JS

var xmlHttp;

function GetXmlHttpObject(){
    var xmlHttp=null;
    try{
        xmlHttp=new XMLHttpRequest();
    }catch(e){
        try{
            xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
        }catch(e){
            xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
        }
    }

    return xmlHttp;
}

function showName(str){
    if(str.length==0){
        document.getElementById("txtint").innerHTML="用户名不能为空！";
        return;
    }

    xmlHttp=GetXmlHttpObject()
    if(xmlHttp==null){
        alert("Browser does not support HTTP Request");
        return;
    }

    var url="index.php"
        url=url+"?q="+str
        url=url+"&uid="+Math.random()
        xmlHttp.open("GET",url,true);
        xmlHttp.onreadystatechange=statechanged
        xmlHttp.send(null)
}

function statechanged(){    
    if(xmlHttp.readyState==4||xmlHttp.readyState=="complete"){
        document.getElementById("txtint").innerHTML=xmlHttp.responseText
    }
}

index.php

header("content-type:text/html;charset=utf-8");  

  $q=$_GET["q"];
  $conn=mysql_connect("localhost","root","admin")or die(mysql_error());
  mysql_select_db("test",$conn)or die(mysql_error());
  mysql_query("SELECT * FROM UTF8");

  $sql="SELECT * FROM testuser where Firstname='".$q."'";
  $result=mysql_query($sql,$conn);

  if(!is_array(mysql_fetch_row($result))){
         echo "<font color='green'>用户名可以使用</font>";

  }else{
         echo "<font color='red'>用户名已经存在</font>";
  }

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!