php点击登陆弹出层并结合ajax+json显示登录后状态

收藏

bootstrap+php演示弹出登录表单，输入用户名或密码后，ajax传参给后台，并获得登陆后的返回值。

0、请不要问“在不在”之类的问题，有问题直接问！1、学生或暂时没有工作的童鞋，整站资源免费下载！2、￥9.9充值终身VIP会员,加我微信，826096331 拉你进VIP群学习！3、程序员加油,技术改变世界。在线 充值

查看演示

加我微信，拉你进VIP群学习：

下载资源 下载积分： 30 积分

hwLayer+ajax弹出登录框

$(function() {
    $('#form-btn').hwLayer({
        width: 480,
        tapLayer: false,
        afterClose: function() {
            console.log('close');
        }
    });
    $(".hwLayer-ok").on('click', function(event) {
        event.preventDefault();
        var user = $('#user').val();
        var pass = $('#password').val();
        if (user == '') {
            $('#msg').addClass('text-danger').text('用户名不能为空！');
            return false;
        }
        if (pass == '') {
            $('#msg').addClass('text-danger').text('密码不能为空！');
            return false;
        }
        $.ajax({
            url: 'login.php',
            type: 'POST',
            dataType: 'json',
            data: {username: user, password: pass},
            beforeSend: function() {
                $('#msg').addClass('text-success').text('正在登录...');
                $(".hwLayer-ok").attr('disabled', true);
            },
            success: function(res) {
                if (res.code == 1) { //登录成功
                    $('#result').html('欢迎您，' + user + '，登录时间：' + res.logintime);
                    $('#msg').removeClass('text-danger').addClass('text-success').text('登录成功！');
                    $('#hw-layer-login').hwLayer('close');
                } else {
                    $('#msg').addClass('text-danger').text('用户名或密码错误！');
                }
                $(".hwLayer-ok").removeAttr('disabled');
            }
        });
    });
    //escape关闭弹出层
    $('.hw-overlay').on('click', function(event) {
        if (event.target == this) {
            $('#hw-layer-login').hwLayer('close');
        }
    });
});

login.php返回值

$arr = array("code"=>1,"logintime"=>date("Y-m-d H:i:s"));
echo json_encode($arr);