徐向博 / Imin.

ajax + php 登陆验证
作者:Imin 时间:2018-04-05 分类: 前端

前两天写的登录页面,保存一下,方便以后复用。

HTML部分:

<div class="login">
    <p class="log-err">&nbsp;</p>
    <input type="text" name="user_name" placeholder="用户名" />
    <input type="password" name="user_pass" placeholder="密码" />
    <button class="submit">登陆</button>
</div>

JS部分:

var _input = $(".login-main").find("input");
//获取输入内容
var username = _input.eq(0).val();
var userpass = _input.eq(1).val();
//执行ajax
$.ajax({
    type: "post",
    url: "login.php",
    data: "au_name=" + username + "&" + "au_pass=" + userpass,
    //请求执行前的操作
    beforeSend: function(){
        $(".submit").text("正在登陆...");
    },
    //执行成功回调函数,接收后台返回值
    success: function(data){ 
        if(data){
            //返回用户昵称,生成cookie并跳转
            $.cookie('im_au', data);
            window.location.href = "../";
        }else{
            //返回false,提示登陆失败
            $(".log-err").text("*用户名或密码错误!");
                _input.eq(i).val("");
            }
            vcode();
            $(".submit").text("登陆");
        }
    }
});

PHP:

<?php
    //获取post数据
    $au_name = $_POST['au_name'];
    $au_pass = $_POST['au_pass'];
    //执行sql查询
    $sql = "SELECT * FROM im_au where au_name = '$au_name' and au_pass = '$au_pass'";
    $res = $mysqli -> query($sql);
    //查询到记录返回用户昵称,否则返回false
    if($res -> fetch_array()){
        echo $res['au_nick'];
    }else{
        echo false;
    }
    mysqli_close($mysqli);
?>

代码仅供参考,请勿直接复制使用,防止出现莫名其妙的八阿哥