ajax实现表单结合数据库通过blur方法发送请求查询验证

发布于 2021-01-23  616 次阅读


image.png

也是一个很简单的js事件,就是blur,刚开始觉得很新奇,所以还是记一下吧~

前言

看到很多大平台的注册页面

都是输入完用户名就自动显示该用户名是否可用

image.png

感觉非常的人性化

后面看了看实现的话其实还是挺简单的

效果实现

很明显是一个元素失去焦点时发生 blur 事件

那就给这个input一个安排一个blur就完事了

function里边用Ajax向自己写好api的发送请求

然后api页面里边连接数据库进行查询即可

可以看具体的实例

js

$("#register_name").blur(function () {
        var name = $("#register_name").val();
        // alert(name);
        if(reg_name){
            $.ajax("chkname.php",{
                type:"POST",
                data:{name:name},
                success:function(data){
                    if(data=='false'){
                        $("#name_false3").css("display","block");
                        reg_name = false;
                    }else if(data=='success'){
                        $("#name_true").css("display","block");
                        reg_name = true;
                    }
                }
            });
        }
    });

php接口

<?php
require ('conn.php');
name =_POST['name'];
sql = "select * from users where user_name='name'";
result = @mysqli_query(con, sql);num_rows = mysqli_num_rows(result);
if(num_rows==1){
    echo 'false';
}else if($num_rows==0){
    echo 'success';
}else{
    echo '错误';
}

代码就是这么点

一个简单的无感查询验证就完成了

我瞎编的

文章水完了~


Only Ctrl C - Ctrl V