作者:幻月九十
链接:https://www.zhihu.com/question/19631256/answer/119911045
来源:知乎
著作权归作者所有,转载请联系作者获得授权。

$('form').submit(function (event) {
event.preventDefault();
var form = $(this); if (!form.hasClass('fupload')) {
//普通表单
$.ajax({
type: form.attr('method'),
url: form.attr('action'),
data: form.serialize()
}).success(function () {
//成功提交
}).fail(function (jqXHR, textStatus, errorThrown) {
//错误信息
});
}
else {
// mulitipart form,如文件上传类
var formData = new FormData(this);
$.ajax({
type: form.attr('method'),
url: form.attr('action'),
data: formData,
mimeType: "multipart/form-data",
contentType: false,
cache: false,
processData: false
}).success(function () {
//成功提交
}).fail(function (jqXHR, textStatus, errorThrown) {
//错误信息
});
};
});

利用Formdata实现form提交文件上传不跳转页面的更多相关文章

  1. 传统表单提交文件上传,以及FormData异步ajax上传文件

    传统的文件上传: 只用将form表单的entype修改成multipart/form-data,然后就可以进行文件上传,这种方式常用并且简单. 以下是另一种方式FormData,有时候我们需要ajax ...

  2. 利用spring的MultipartFile实现文件上传【原】

    利用spring的MultipartFile实现文件上传 主要依赖jar包 spring-web-3.0.6.RELEASE.jar 用到 (org.springframework.web.multi ...

  3. 利用Bootstrap简单实现一个文件上传进度条

    © 版权声明:本文为博主原创文章,转载请注明出处 说明: 1. 使用commons-fileupload.jar实现文件上传及进度监听 2. 使用bootstrap的进度条进行页面显示 3. 因为进度 ...

  4. FormData序列化及file文件上传

    表单数据上传 情况一: 一.当表单文件处于无任何处理状态时,用submit提交直接上传; 但这种方式上传,数据无任何处理:(极少使用): 但是传统的表单提交会导致页面刷新,但是有些情况下,我们并不希望 ...

  5. 使用jquery的ajax提交文件上传

    以前的项目大多的使用jquery的插件来进行文件上传,对于就只引用jquery而不使用插件来上传文件之前未有写过,最近项目里有写到和用到,就记录一下,以后方便查找. 提示:存在浏览器皆容问题,谨慎使用 ...

  6. php利用iframe实现无刷新文件上传功能

    上传原理很简单就是利用表单的打开方式为iframe的name名,这样就可以在当前页面的iframe打来了,实现文件上传,再利用js返回上传结果. form target .在 action 属性中规定 ...

  7. 使用PHP和HTML5 FormData实现无刷新文件上传教程

    无刷新文件上传是一个常见而又有点复杂的问题,常见的解决方案是构造 iframe 方式实现. 在 HTML5 中提供了一个 FormData 对象 API,通过 FormData 可以方便地构造一个表单 ...

  8. 利用bootsrap控件 实现文件上传功能

    源代码实例:https://github.com/kartik-v/bootstrap-fileinput 一.jsp页面 <%@ page language="java" ...

  9. form里面文件上传并预览

    其实form里面是不能嵌套form的,如果form里面有图片上传和其他input框,我们希望上传图片并预览图片,然后将其他input框填写完毕,再提交整个表单的话,有两种方式! 方式一:点击上传按钮的 ...

随机推荐

  1. 使用 Git 管理源代码

    在现代软件开发项目中,要成为一个有效的软件开发人员,我们必须能够与其他项目贡献者并行进行开发.源代码管理(SCM)系统不是什么新思想.为了编写一些能够更快速.简单地开发以后软件项目的软件,已经进行了很 ...

  2. winform.布局

    布局:默认布局:自己拖动进行布局,工具栏里对齐方式 右键,锁定.##随容器拉动变化属性:Anchor:上下左右,固定的设置 panel的排列 1.Dock属性:(顺序填充)Top:靠上,高度不变,左右 ...

  3. SPI线协议详解

    更多的内容可以参考 https://en.wikipedia.org/wiki/Serial_Peripheral_Interface_Bus SPI的工作模式: CPOL.CPHA的搭配可以有四种工 ...

  4. TStringList TMemo Text与Add赋值的区别 Memo.Text赋值高度注意事项,不得不知的技巧。

    Memo.Text赋值高度注意事项,不得不知的技巧. list := TStringList.Create;  list.Text:= str:  list.Count; list.Clear;  l ...

  5. _Dispose(typeinfo,pointer ); 不知道说的是什么? 感觉会有用, 留待以后研究

        [传说]晓不得2013(26562729)  16:45:41别人把文章发出来,说明就是验证过的.[潜水]ひㄨㄨ那个ㄨㄨ(1548253108)  16:46:23[潜水]ひㄨㄨ那个ㄨㄨ(15 ...

  6. jQuery触发<a>标签的点击事件无效

    <a id="workFrame" href="pages/work.html" target="FrameBox">首页< ...

  7. DrawingControl控件在Add Page时报故障的问题

    Visio二次开发用到了Drawing Control控件.在控件上添加新页面时,visual编译器报内存保护故障“尝试读取或写入受保护的内存.这通常指示其他内存已损坏.”,这个问题困扰了我很久,最后 ...

  8. hdu 1577 WisKey的眼神 (数学几何)

    WisKey的眼神 Time Limit: 1000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total S ...

  9. iOS 拨打电话三种方法

    小弟查了很多地方的关于iOS程序拨打电话,大都不全,今天我总结了三种方法,各有不同,拿来给大家分享,希望给大家有所帮助1,这种方法,拨打完电话回不到原来的应用,会停留在通讯录里,而且是直接拨打,不弹出 ...

  10. [html]兼容 IE6 IE7 的简单网页框架

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...