使用jquery.form.js jQuery插件导致我的表单被提交两次

Question

我正在使用名为“ jquery.form.js”（ http://malsup.com/jquery/form/#getting-started ）的jquery插件，以便能够在我的ASP.Net MVC项目中使用Ajax上传文件。 我遇到的问题是，当我按下表单中的“提交”按钮时，处理上传的控制器动作被调用了两次。 第一次将其称为HttpPostedFileBase对象时，已使用上载的文件对其进行了正确设置。 第二次将其称为HttpPostedFileBase对象设置为Nothing。 我不希望该处理程序被调用两次。 如何防止出现双重职务？

风景：

@Using Html.BeginForm("Document", "NewDocument", Model, FormMethod.Post, New With {.enctype = "multipart/form-data", .id = "submitimage-form"})
 <input type="file" id="fileInput" name="fileInput" />
 <input type="submit" id="submitbutton" value="Accept" data-mini="true" data-theme="b" data-icon="check" />

End Using

<script src="~/Scripts/jquery.form.js"></script>
<script>
$(document).on("pageshow", '#choosenewdocument', function () {
      $("#submitimage-form").ajaxForm(function () {
      });
  });
</script>

控制器处理程序：

<HttpPost()> _
Function Document(ByVal model As MaxDocument, fileInput As HttpPostedFileBase) As ActionResult
     ...
End Function

Answer 1

尝试preventDefault

<script>
$(document).on("pageshow", '#choosenewdocument', function () {
      $("#submitimage-form").ajaxForm({
         beforeSubmit: function() {
           return false;
         }
      });

  });
</script>

preventDefault （顾名思义）可防止发生默认操作。

Answer 2

因此，为防止在使用jquery ajax时出现双重提交，只需将其放在表单中

action="javascript:null();"