表单提交阻塞问题

Question

我在提问方面是个新手，但我已经读了很多 articles/questions/answers 很长一段时间了。我的问题是关于一段代码的一部分，这段代码让我卡住了一段时间。

所以在我的项目中，我有一个注册表单，其中包含 JS 验证和服务器端验证。现在我想做的是在 JS 验证正常之前禁用表单提交，并且我已经设置了一些条件让它像那样。现在，当满足这些条件时，问题就出现了。我用这一行来停止提交表单：

$('.memberReg').on('submit',function(){return false;});

例如在这样的情况下：

if(response.okText == 'SUCCESS' && response.warning == null ) 
                        {

                            $('label[for="email"]').addClass("success");
                            $('label[for="email"]').append("<span>    is not yet registered!</span>");  
                            console.log(result);
                        }else 
                            {

                                $('label[for="email"]').addClass("error");
                                $('label[for="email"]').append("<span>   is already taken!</span>");
                                $('.memberReg').on('submit',function(){return false;});

                            }

这里发生的事情是我确实阻止了表单的提交，但它被完全阻止了，即使满足其他条件也是如此。在此示例中，即使使用正确的电子邮件，您也无法再提交。

我曾尝试使用带有真假语句的变量，使 validForm() 函数提交表单，但该函数开始循环，但仍然无法启用表单。

我也试过在有效邮件部分提交表单时使用return true，还是一样的效果。

谁知道如何只在特定条件下阻止它而不是完全阻止它以便用户发送时必须刷新？

Answer 1

问题是您正在覆盖提交处理程序，一旦覆盖，它就会消失，直到页面重新加载。老实说，我会完全质疑这种方法；您不必覆盖提交处理程序来阻止提交表单。

顺便说一下，您使用的是 JavaScript 验证，而不是 AJAX 验证。 AJAX是向服务器发送请求，并可能收到结果的过程，无需刷新页面

Answer 2

我相信我已经弄明白了，经过几次测试后它运行顺利，所以我会 post 它以防其他人可能遇到同样的问题。

所以一开始我使用了：

$('.memberReg').on('submit',function(){return false;});

正如一位好人在他的一个回答中告诉我的那样，它正在覆盖提交处理程序。所以我尝试将我的方法更改为我想要实现它的方式并使用：

$( ".memeberReg" ).submit(function( event ) {
 if ( condition ) { 
       //successfulValidationCode
        return;
    } 
      //errorCode
      event.preventDefault();
})

在某些情况下，我正在检查我在字段验证中设置的变量，如果输入错误，我会使用 event.preventDefault(); 再次阻止表单。

表单提交阻塞问题

Form submission blocking issues

javascript

forms

ajax

submit