php - 在 Jquery 中添加 JS 函数以检查用户名是否可用

Question

我想问关于 JS 函数的问题，现在我想这个函数正在检查用户名这是我的 JS 代码：

jQuery.validator.addMethod("noSpace", function(value, element) { 
    return value.indexOf(" ") < 0 && value != ""; 
    });

    $().ready(function()
    {
        $("#signupForm").validate(
        {
            rules:
            {
                full_name: "required",
                username: {
                    required: true,
                    minlength: 2,
                    noSpace: true,
                },
                password: {
                    required: true,
                    minlength: 5
                },
                email: {
                    required: true,
                    email: true
                },
            },
            messages:
            {
                full_name: "Please enter your full name",
                username:
                {
                    required: "Please enter a username",
                    minlength: "Your username must consist of at least 2 characters",
                    noSpace: "No space allowed",
                },

                password:
                {
                    required: "Please provide a password",
                    minlength: "Your password must be at least 5 characters long"
                },

                email: "Please enter a valid email address"
            }
        });
    });

那么如何添加该功能以检查可用用户名并将其显示在输入文本用户名下方（如果可用或不可用），如果可用用户可以继续提交表单。如果没有，用户将无法继续提交表单。

要检查用户名，我使用 PHP 语言和 Mysql 数据库。

任何想法 ？

Answer 1

尝试使用此示例，请注意此处如何使用 checkAvailability

$(document).ready(function() {
jQuery.validator.addMethod("checkAvailability",function(value,element){
 var x= $.ajax({
    /*Setting of request*/
 }).responseText;

 if($("message", x).text()=="true") return true;
 else return false;
},"Sorry, this user name is not available");

$("#loginForm").validate({
    rules:  {
        username: {
            required: true,
            minlength: 4,
            checkAvailability: true
        },
    },

    submitHandler: function(form){send()}
});
});