Rumah > pembangunan bahagian belakang > tutorial php > web注册页面动态匹配验证之用户验证php实现一

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

不言
Lepaskan: 2023-03-29 22:38:01
asal
1645 orang telah melayarinya

这篇文章主要介绍了关于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>
Salin selepas log masuk

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();
}
Salin selepas log masuk

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;

?>
Salin selepas log masuk
更新:(2018年6月5日14:31:00)
Salin selepas log masuk
//判断输入的账账号长度是否大于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 = "必须以字母开头!";    
}
}
Salin selepas log masuk

4:

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

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

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


php代码解释:

1.

$v=trim($_GET[&#39;v&#39;]);
Salin selepas log masuk

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

2.

if (strlen($v) > 0)
Salin selepas log masuk

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

3.

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

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

4.

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

5.

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); //关闭数据库连接
Salin selepas log masuk

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

6.

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

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

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

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

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

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

        }
    }
Salin selepas log masuk


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

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

生气

-----新增加内容:

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

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

里面添加一样onblur 事件

Atas ialah kandungan terperinci web注册页面动态匹配验证之用户验证php实现一. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan