表单验证仅在用户名不存在时发送答案

【问题标题】：Form Validation To Send Only If Username Doesn't Exist表单验证仅在用户名不存在时发送
【发布时间】：2013-03-11 16:26:02
【问题描述】：

我创建了一个 JQuery 脚本，用于检查数据库中的用户名，如果您在 keyup 上输入现有名称，则会显示错误，这很好，但即使此错误为真，表单仍会提交。我可以添加哪些其他代码来检查此错误是否不存在？这是我到目前为止的代码：

<script>
        $(function()
        {
        var ck_username = /^[A-Za-z0-9_]{5,15}$/;
// Username validation
        $('#username').keyup(function()
        {
        var username=$(this).val();
        if (!ck_username.test(username))
        {
        $('.usernameStatus').removeClass("success").addClass("error");
        }
        else
        {
        $('.usernameStatus').removeClass("success").removeClass("error");
            jQuery.ajax({
                type: 'POST',
                url: 'check-users.php',
                data: 'username='+ username,
                cache: false,
                success: function(response){
                    if(response == 1){
                        $('.usernameStatus').removeClass("success").addClass("error");
                    }
                    else {
                        $('.usernameStatus').removeClass("error").addClass("success");
                    }
                }
            });
        }
        });
// Submit button action
        $('#registerButton').click(function()
        {
        var username=$("#username").val();
        if(ck_username.test(username))
        {           
            jQuery.post("register.php", {
            username:username,
            },  function(data, textStatus){
            if(data == 1){
            window.location.replace("registered.php");
            }else{}
            });
        }else{
        alert("Something went Wrong - Please Check All Fields Are Filled In Correctly");
        }
        return false;
        });
        //End
        });
        </script>

谢谢

【问题讨论】：

所以“出现问题”的警报从未显示？
鉴于你的 php 脚本没有修改数据库，只是得到结果，它应该是一个 GET。（我今天才知道这个，想我会分享:-)）
警报未显示，我猜我必须在“if(ck_username.test(username))”中添加一些内容以确保未找到用户名 - 可能通过在 IF 语句中添加一些东西？？？
@ravloony POST 很好。 POST 和 GET 只是两种不同的 HTTP 方法，与修改数据库无关。
POST ：请求服务器接受请求中包含的实体作为 URI 标识的 Web 资源的新下级。例如，发布的数据可能是现有资源的注释；公告板、新闻组、邮件列表或评论线程的消息；将 Web 表单提交给数据处理过程的结果的数据块；或要添加到数据库的项目。 -- en.wikipedia.org/wiki/…

标签： php jquery validation

【解决方案1】：

请查看代码中的 cmets 假设data == 1表示名字已经注册，你会报错

<script>
        $(function()
        {
        var name = false; // a variable that holds false as the initial value
        var ck_username = /^[A-Za-z0-9_]{5,15}$/;
// Username validation
        $('#username').keyup(function()
        {
        var username=$(this).val();
        if (!ck_username.test(username))
        {
        $('.usernameStatus').removeClass("success").addClass("error");
        }
        else
        {
        $('.usernameStatus').removeClass("success").removeClass("error");
            jQuery.ajax({
                type: 'POST',
                url: 'check-users.php',
                data: 'username='+ username,
                cache: false,
                success: function(response){
                    if(response == 1){
                        $('.usernameStatus').removeClass("success").addClass("error");
                    }
                    else {
                        $('.usernameStatus').removeClass("error").addClass("success");
                        name = true; // on success , if the name isnt there then assign it to true
                    }
                }
            });
        }
        });
// Submit button action
        $('#registerButton').click(function()
        {
        var username=$("#username").val();
        if(ck_username.test(username) && name == true) // check for the value of name
        {           
            jQuery.post("register.php", {
            username:username,
            },  function(data, textStatus){
            if(data == 1){
            window.location.replace("registered.php");
            }else{}
            });
        }else{
        alert("Something went Wrong - Please Check All Fields Are Filled In Correctly");
        }
        return false;
        });
        //End
        });
        </script>

【讨论】：

【解决方案2】：

您应该检查$('.usernameStatus') 的状态，而不是根据正则表达式检查用户名，因为它有可能通过了正则表达式测试，但仍然无法通过从您的数据库返回的重复测试。

所以

$('#registerButton').click(function()
        {
        var username=$("#username").val();
        if(ck_username.test(username))
        {

应该是：

$('#registerButton').click(function()
        {
        var username=$("#username").val();
        if(!$('.usernameStatus').hasClass('error'))
        {

最好引入一个变量来保存名称字段的有效性，这样您就不需要一直获取 DOM 元素并检查它的类。

【讨论】：

【解决方案3】：

我认为您的错误可能是因为 data 语法错误

应该是这样的：

data: 'username:'+ username,

调试你的 PHP 代码，看看它现在是否正确接收用户名

【讨论】：

谢谢，我会这样做只是为了确保，到目前为止它工作正常，但安全总比抱歉好，谢谢