recherche

Maison >développement back-end >tutoriel php >Comment utiliser ajax en PHP pour créer une page de connexion, vérifier si le nom d'utilisateur est disponible et appeler dynamiquement la base de données

Comment utiliser ajax en PHP pour créer une page de connexion, vérifier si le nom d'utilisateur est disponible et appeler dynamiquement la base de données

一个新手
一个新手original
2017-10-09 09:26:311510parcourir

1.Connaissance de base d'ajax

ajax est une technologie d'application complète étendue en combinant jquery, php et d'autres technologies. Ce n'est pas un nouveau contenu. Ajax est également écrit dans la balise 3f1c4e4b6b16bbbd69b2ee476dc4f83a

Si vous utilisez ajax, vous devez avoir une page de traitement. La page de traitement exploite uniquement la base de données et renvoie les valeurs. Les pages sont toutes traitées par ajax.

2. Utilisez ajax pour créer la page de connexion dengluchuli.php


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="../jquery-1.11.2.min.js"></script>
<title>无标题文档</title>
</head>
<body>
<p>用户名：<input type="text" id="uid" /></p>
<p>密码：<input type="text" id="pwd" /></p>
<p><input type="button" value="登录" id="btn" /></p>
</body>

<script type="text/javascript">$(document).ready(function(e) {
    $("#btn").click(function(){//给按钮加点击事件
        
        //取用户名和密码
        var u = $("#uid").val();//取输入的用户名
        var p = $("#pwd").val();//取输入的密码
        
        //调ajax
        $.ajax({            
            url:"dengluchuli.php",
            data:{u:u,p:p},//第二个u和p只是变量，可以随意写，dengluchuli.php里面的u和p都是第一个。
            type:"POST",
            dataType:"TEXT",
            success: function(data){                    if(data.trim()=="OK")//要加上去空格，防止内容里面有空格引起错误。                    {
                        window.location.href="main.php";//js跳转页面，要记住。                    }                    else
                    {                        echo("用户名或密码错误");
                    }
            
                }
            
            });
        
        })
});</script>

</html>

La page de traitement de connexion dengluchuli.php

<?php
$uid = $_POST["u"];
$pwd = $_POST["p"];
include("./DBDA.class.php");
$db = new DBDA();
$sql = "select password from login where username=&#39;{$uid}&#39;";
$mm = $db->StrQuery($sql,0);
if($mm == $pwd && $pwd!="")
{
    echo "OK";
}
else
{
    echo "NO";
}

3. Utilisez ajax pour vérifier si le nom d'utilisateur est disponible testuid.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="../jquery-1.11.2.min.js"></script>
<title>无标题文档</title>
</head>
<body>
<input type="text" id="uid" />
<span id="ts"></span>
</body>
<script type="text/javascript">
    
    $("#uid").blur(function(){//blur表示失去焦点时触发
        
        //取用户名
        var uid = $("#uid").val();
        
        //调ajax
        $.ajax({
            url:"uidchuli.php",
            data:{u:uid},
            type:"POST",
            dataType:"TEXT",
            success: function(data){
                    if(data>0)
                    {
                        $("#ts").html("该应户名已存在");
                        $("#ts").css("color","red");
                    }
                    else
                    {
                        $("#ts").html("该应户名可用");
                        $("#ts").css("color","green");
                    }
                }
            
            });
        
        })
</script>
</html>

Page de processus uidchuli.php


<?php
$uid = $_POST["u"];
    include("./DBDA.class.php");
    $db = new DBDA();
    $sql = "select count(*) from login where username=&#39; {
    $uid
}
&#39;";
    echo $db->StrQuery($sql,0);

Le L'effet est le suivant :

4. Appelez dynamiquement la base de données, saisissez des mots-clés dans la zone de recherche et le contenu contenant des mots-clés apparaîtra automatiquement sous la zone de saisie.

list.php


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="../jquery-1.11.2.min.js"></script>
<title>无标题文档</title>
</head>

<body>
<br />
<p>
    <input type="text" id="name" />
</p>
<p id="list"></p>
</body>

<script type="text/javascript">$("#name").keyup(function(){    //取名称
    var n = $(this).val();    if(n!="")
    {        //调ajx
        $.ajax({
            url:"listchuli.php",
            data:{n:n},
            type:"POST",
            dataType:"TEXT",
            success: function(data){                var sz = data.split("|");            
                var str = "";            
                for(var i=0;i<sz.length;i++)
                {
                    str = str+"<p class=&#39;l&#39;>"+sz[i]+"</p>";
                }
                $("#list").html(str);
            
                }
        
            });
        }        else
        {
            $("#list").html("");
        }
    
    })</script>

</html>

Page de traitement listchuli.php

<?php
$name = $_POST["n"];
    include("./DBDA.class.php");
    $db = new DBDA();
    $sql = "select areaname from chinastates where areaname like&#39;% {
    $name
}
%&#39;";
    echo $db->StrQuery($sql,0);

L'effet est le suivant :

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration：
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Article précédent：Introduction à la méthode de détermination du format d'image du téléchargement de fichier en PHPArticle suivant：Introduction à la méthode de détermination du format d'image du téléchargement de fichier en PHP

Articles Liés

Voir plus