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

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

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

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

Answer 3

不要这么早地调用e.preventDefault()，只有当你真的想要以默认方式阻止表单发布时才这样做（因此，当选择一个文件时）。这样你可以摆脱第二个if语句，只要让提交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 4

this.submit()，前提是您没有使用<input name="submit" />

等内容覆盖它

演示：

http://jsfiddle.net/4buHP/

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

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;
   }
});

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

5 个答案: