Question

我正在验证注册页面上的表单，一切正常，但电子邮件验证有点受欢迎。

如果我只是验证它以确保它是一个实际的电子邮件地址，它可以正常工作，但是当我尝试添加一个检查以查看它是否正在使用时我会遇到问题。

验证本身工作正常，但一旦验证并且未使用，表单将不会提交。

这样可行，表格提交：

if(filter.test(a)){
        email.removeClass("field_error");
        emailInfo.text("");
        emailInfo.removeClass("error");
        return true;
    }

这样可行，但表单未提交：

if(filter.test(a)){
        $.post('php/availability.php',{email: $('#email').val()}, function(emaildata){
            if(emaildata.exists){
                email.addClass("field_error");
                emailInfo.text("(Email address in use)");
                emailInfo.addClass("error");
            } else {
                email.removeClass("field_error");
                emailInfo.text("");
                emailInfo.removeClass("error");
                return true;
            }
        }, 'JSON');
    }

我很难过。

Answer 1

问题与AJAX调用的异步性质有关（第一个'A'）。

在您的第一个示例中，您将进入if块并立即返回true，我认为该版本允许您的表单提交。

但是，在第二个示例中，您将进入if块，但之后您将异步调用Web资源（availability.php）。您的代码进行AJAX调用（$.post()调用），然后立即点击if块的末尾。不会返回True，因此您的表单无法提交。

您需要做的是：

将您的exists===false逻辑移至单独的函数;

if

，如果电子邮件有效，则调用该函数;
你的函数找到表单（比如用jQuery），然后提交它

因此，修改后的代码可能如下所示：

if(filter.test(a)){
        $.post('php/availability.php',{email: $('#email').val()}, function(emaildata){
            if(emaildata.exists){
                email.addClass("field_error");
                emailInfo.text("(Email address in use)");
                emailInfo.addClass("error");
            } else {
                submitForm(email, emailInfo);
            }
        }, 'JSON');
    }

然后submitForm()执行类似的操作：

function submitForm(email, emailInfo){
  email.removeClass("field_error");
  emailInfo.text("");
  emailInfo.removeClass("error");
  $('#theForm').submit();
}

我认为，您应该看到您的表单提交。

希望这有帮助！

表格未通过电子邮件JSON验证后提交

1 个答案: