web注册页面动态匹配验证之用户验证php实现一

这篇文章主要介绍了关于web注册页面动态匹配验证之用户验证php实现一，有着一定的参考价值，现在分享给大家，有需要的朋友可以参考一下

需要知识：1.php数据库连接

                  2.php 正则表达匹配

                    3.ajax  --

•                              HTML 和 CSS 基础

•                                JavaScript 基础

1 ：

创建好输入框：

<input name="username" type="text" class="form-control" id="contact_username" onkeyup="loadXMLDoc(this.value)" placeholder="用户名" required/>
            <span id="txtHint"></span>

2：

js 实现 提示效果：（原文出自：点击打开链接）

function loadXMLDoc(str)
{

    if (str.length==0)
    {
        document.getElementById("txtHint").innerHTML="";
        return;
    }
    var xmlhttp;
    //检查浏览器是否支持 XMLHttpRequest 对象
    if (window.XMLHttpRequest)
    {
        // IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
        xmlhttp=new XMLHttpRequest();
    }
    else
    {
        // IE6, IE5 浏览器执行代码
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange=function()
    {
        if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
            //responseText	获得字符串形式的响应数据。
            document.getElementById("txtHint").innerHTML=xmlhttp.responseText;

        }
    }
    xmlhttp.open("GET","../common/verify.php?v="+str,true);
    xmlhttp.send();
}

3：

php代码实现动态验证：（验证有缺陷，因为是自己写的，有好多地方不完美，我会继续改善）

<?php

//注册验证----------

$v=trim($_GET[&#39;v&#39;]);     //获取用户输入的账号

$hint = "";  //用作返回输出



//判断是账号还是密码，或者其他匹配

    //判断输入的账账号长度是否大于0
    if (strlen($v) > 0)
    {

        //用户验证
        //1.必须以字母开头
        if(preg_match("/^[a-z]/",$v)){
            //2.至少5个字符
            if(preg_match("/^[a-z][\w]{4}/",$v))
            {
                echo $v;
                $hint = "";  //当满足时，让它输入空 因为前面不满足赋值了
                //数据库建立连接
                require "mysqli.php";
                //数据库查询语句--查询输入的账号是否存在
                $sql="select `username` from `user` where `username`=&#39;$v&#39;";
                $result = mysqli_query($conn, $sql);
                //当mysqli_num_rows($result)> 说明查到里数据
                if(mysqli_num_rows($result) > 0){
                    $hint ="该用户已存在！";
                }else{
                    $hint = "该用户可用";
                }
                mysqli_close($conn); //关闭数据库连接
            }else{
                $hint = "至少5个字符!";
            }

        }else{
            $hint = "必须以字母开头！";
        }
    }



if ($hint == "")
{
    $response="";
}
else
{
    $response=$hint;
}
//打印返回
echo $response;

?>

更新：（2018年6月5日14:31:00）

//判断输入的账账号长度是否大于0if (strlen($v) > 0) {    //用户验证    
//1.必须以字母开头    
if (preg_match("/^[a-z]/", $v)) {        
//2.至少5个字符最长不超过11个字符        
if (strlen($v) < 5 || strlen($v) > 11) {            
$hint = "至少5个字符,最长不超过11个字符!";        
} else {            
//3.模式匹配            
if (preg_match("/^[a-z][\w]{2,10}$/", $v)) {                
echo $v;                
$hint = "";  //当满足时，让它输入空 因为前面不满足赋值了                
//数据库建立连接                
require "mysqli.php";                
//数据库查询语句--查询输入的账号是否存在                
$sql = "select `username` from `user` where `username`=&#39;$v&#39;";                
$result = mysqli_query($conn, $sql);                
//当mysqli_num_rows($result)> 0 说明查到里数据                
if (mysqli_num_rows($result) > 0) {                    
$hint = "该用户已存在！";                
} else {                    
$hint = "该用户可用";                
}                
mysqli_close($conn); //关闭数据库连接            
}else {                
$hint = "用户名只能是数值，字母，下划线";            
}        
}    
} else {        
$hint = "必须以字母开头！";    
}
}

4：

完全出自自己的理解自己口语表达解释的，不够专业也不够标准，如有出错地方欢迎指出：QQ363491343

解释：当我们在用户名输入框内输入要注册的用户名时，

函数调用loadXMLDoc() 方法 （见第二步），从而进行相关动态验证（具体介绍见点击打开链接）

php代码解释：

1.

$v=trim($_GET['v']);

用于获得用户动态输入的用户名；

2.

if (strlen($v) > 0)

用户输入的用户名必须大于0；这是最基本的。

3.

if(preg_match("/^[a-z]/",$v)){

然后我规定用户名必须以字母开头，不区分大小写

4.

这是我想用户名至少5个字符；

5.

echo $v;$hint = "";  //当满足时，让它输入空 因为前面不满足赋值了
//数据库建立连接
require "mysqli.php";//数据库查询语句--查询输入的账号是否存在
$sql="select `username` from `user` where `username`='$v'";
$result = mysqli_query($conn, $sql);//当mysqli_num_rows($result)> 说明查到里数据
if(mysqli_num_rows($result) > 0){    
$hint ="该用户已存在！";
}else{    
$hint = "该用户可用";}mysqli_close($conn); //关闭数据库连接

这部分就是当前面都满足时候，就在数据库里面动态查找，看是否用户已经存在。

6.

if ($hint == ""){    
$response="";
}else{    
$response=$hint;}//打印返回echo $response;

最后输出返回要显示的内容；

这里我经过自己验证，在PHP里面echo 输出的都是返回的内容。

如果php有警告信息，或者出现错误，都会返回到前端去。

如果你ajax 学的不错，那么下面代码也就好理解了：

xmlhttp.onreadystatechange=function()
    {
        if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
            //responseText	获得字符串形式的响应数据。
            document.getElementById("txtHint").innerHTML=xmlhttp.responseText;

        }
    }

嗯，以上是我自己写的用户账号通过服务器实现动态验证效果，也是边学边做，希望能够帮到和我一样的新手同学。

如果有大佬在，欢迎指出错误与不足之处。

-----新增加内容：

当焦点离开输入框，隐藏提示信息

   //当焦点离开输入框，隐藏提示信息function upperCase(){
    document.getElementById("txtHint").innerHTML="";}

在

<input name="username" type="text" class="form-control" id="contact_username" onkeyup="loadXMLDoc(this.value)" onblur="upperCase()" placeholder="用户名" required/><span id="txtHint"></span>

里面添加一样onblur 事件

以上是web注册页面动态匹配验证之用户验证php实现一的详细内容。更多信息请关注PHP中文网其他相关文章！