jQuery ajax表单提交 - 验证失败时导致的多个发布/获取请求

Question

我有一个问题，如果表单提交（设置为通过AJAX提交）验证失败，下次提交表单时，它会使请求的数量翻倍 - 这绝对不是我想要发生的。我正在使用jQuery ValidationEngine插件提交表单并将验证消息绑定到我的字段。这是我的代码。我认为我的问题可能在于我通过$（'。form_container form'）检索表单操作属性.attr（'action'） - 我必须这样做才能使用$（this）.attr拿起第一个加载的表单的动作attr - 然而，当我在页面中加载新表单时，它不会正确地拾取新表单的动作，直到我删除$（this）选择器并使用类引用它。谁能看到我在这里做错了什么？ （注意我有2个类似的表单处理程序，它们在domready上加载，这也可能是一个问题）

        $('input#eligibility').live("click", function(){
            $(".form_container form").validationEngine({
                ajaxSubmit: true,
                ajaxSubmitFile: $('.form_container form').attr('action'),
                success :  function() {
                    var url = $('input.next').attr('rel');
                    ajaxFormStage(url);
                },
                failure : function() {
                    //unique stuff for this form
                }
            });
        });
         //generic form handler - all form submissions not flagged with the #eligibility id
        $('input.next:not(#eligibility)').live("click", function(){
            $(".form_container form").validationEngine({
                ajaxSubmit: true,
                ajaxSubmitFile: $('.form_container form').attr('action'),
                success :  function() {
                    var url = $('input.next').attr('rel');
                    ajaxFormStage(url);
                },
                failure : function() {
                }
            });
        });

Answer 1

问题是当您单击两次时绑定验证引擎两次。我对validateengine不太熟悉，但我确信这是你的问题。

一旦绑定了validationEngine，你需要确保不再绑定它。

---

修改

或者这样做：

    $('#eligibility').live("click", function(){
        $.validationEngine.submitForm($(".form_container form"),{
            ajaxSubmit: true,
            ajaxSubmitFile: $('.form_container form').attr('action'),
            success :  function() {
                var url = $('input.next').attr('rel');
                ajaxFormStage(url);
            },
            failure : function() {
            }
        });
        return false;
   });
   $('input.next:not(#eligibility)').live("click", function(){
        $.validationEngine.submitForm($(".form_container form"),{
            ajaxSubmit: true,
            ajaxSubmitFile: $('.form_container form').attr('action'),
            success :  function() {
                var url = $('input.next').attr('rel');
                ajaxFormStage(url);
            },
            failure : function() {
            }
        });
        return false;
  });