JQuery 从提交函数内部提交表单

Question

以下是我想在 JQuery 脚本中执行的操作。在下面的提交函数（第 4 个）中，我想确定表单是否有文件输入并使用 ajax 提交或只是不使用 ajax 的常规表单提交。换句话说，如果表单已上传，则进行常规提交。

我在下面的提交功能中写了这个问题。这是我让它发挥作用唯一需要的东西。

谢谢你！

function FindFileInput(){
   // check for file input
   var FileInput = $('input:file');
   if(FileInput.length > 0){
      return true;
   }else{
      return false;
   }
}

function validation(){
  // code to validate form
  ...
}

function ajaxSubmit(formData){
   $.ajax({
      // ajax submit code
   });
}

$(myForm).submit(function(e){
   e.preventDefault();

   // 1. if NO file input present
   if(FindFileInput() === false){
      if(validation() === true){
         // serialize and call ajaxSubmit function
      }
   }

   // 2. if file input IS present
   if(FindFileInput() === true){
      if(validation() === true){
         // QUESTION: How do I submit the form here???
      }
   }
});

Answer 1

来自 http://api.jquery.com/submit/：

现在，当提交表单时，会发出警报消息。发生这种情况
在实际提交之前，因此我们可以通过以下方式取消提交操作
在事件对象上调用 .preventDefault() 或返回 false
来自我们的处理程序。当另一个事件发生时，我们可以手动触发该事件
单击元素：

所以改变你的逻辑。不要将 e.preventDefault() 作为默认调用，然后尝试撤消它，而是仅在实际需要时才调用它。

$(myForm).submit(function(e){

    // 1. if NO file input present
    if(FindFileInput() === false){
        if(validation() === true){
            ajaxSubmit(formdata);
        }
     }

     // 2. if file input IS present
     if(FindFileInput() === true){
         if(validation() === true){
             return true; // submit form as normal, don't call e.preventDefault()
         }
     }

     // Prevent form from submitting normally
     e.preventDefault();
     return false;
});

Answer 2

不要这么早调用 e.preventDefault()，仅当您确实想要阻止以默认方式发布表单时（即选择文件时）才执行此操作。这样你就可以去掉第二个 if 语句，当有文件要发送时，让 Submit JS 函数不执行任何操作。这样，如果未选择文件，表单将以默认方式发送。

$(myForm).submit(function(e){

   // 1. if NO file input present
   if(FindFileInput() === false){
      if(validation() === true){
         e.preventDefault();
         // Do your AJAX-stuff here
      }
   }

});

Answer 3

this.submit() 前提是您没有使用

demo:

http://jsfiddle.net/4buHP/

本机 .submit() 不会触发 jQuery 事件。

Answer 4

如果您希望继续提交，请不要​​阻止默认行为并返回 true。

$(myForm).submit(function(e){

    if(!FindFileInput()){
        if(validation()){
            //AJAX method
        }
    }else{
        if(validation()){
            return true;
        }
    }
    e.preventDefault();
    return false;
});

Answer 5

简单的！我删除了 e.preventDefault();并添加了一些其他条件。然而，我提供了一个非常程序化（不太理想）的解决方案。

$(myForm).submit(function(e){

   // 1. if NO file input present
   if(FindFileInput() === false){
      if(validation() === true){
         // serialize and call ajaxSubmit function

         return false; // stops form submissions, same as preventDefault but less chars.
      }
   }

   // 2. if file input IS present
   if(FindFileInput() === true){
      if(validation() === true){
         // QUESTION: How do I submit the form here???
         // no return false, moves forward.
      } else {
          return false;
      }
   } else {
      return false;
   }
});