利用Formdata实现form提交文件上传不跳转页面
作者:幻月九十
链接: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提交文件上传不跳转页面的更多相关文章
- 传统表单提交文件上传,以及FormData异步ajax上传文件
传统的文件上传: 只用将form表单的entype修改成multipart/form-data,然后就可以进行文件上传,这种方式常用并且简单. 以下是另一种方式FormData,有时候我们需要ajax ...
- 利用spring的MultipartFile实现文件上传【原】
利用spring的MultipartFile实现文件上传 主要依赖jar包 spring-web-3.0.6.RELEASE.jar 用到 (org.springframework.web.multi ...
- 利用Bootstrap简单实现一个文件上传进度条
© 版权声明:本文为博主原创文章,转载请注明出处 说明: 1. 使用commons-fileupload.jar实现文件上传及进度监听 2. 使用bootstrap的进度条进行页面显示 3. 因为进度 ...
- FormData序列化及file文件上传
表单数据上传 情况一: 一.当表单文件处于无任何处理状态时,用submit提交直接上传; 但这种方式上传,数据无任何处理:(极少使用): 但是传统的表单提交会导致页面刷新,但是有些情况下,我们并不希望 ...
- 使用jquery的ajax提交文件上传
以前的项目大多的使用jquery的插件来进行文件上传,对于就只引用jquery而不使用插件来上传文件之前未有写过,最近项目里有写到和用到,就记录一下,以后方便查找. 提示:存在浏览器皆容问题,谨慎使用 ...
- php利用iframe实现无刷新文件上传功能
上传原理很简单就是利用表单的打开方式为iframe的name名,这样就可以在当前页面的iframe打来了,实现文件上传,再利用js返回上传结果. form target .在 action 属性中规定 ...
- 使用PHP和HTML5 FormData实现无刷新文件上传教程
无刷新文件上传是一个常见而又有点复杂的问题,常见的解决方案是构造 iframe 方式实现. 在 HTML5 中提供了一个 FormData 对象 API,通过 FormData 可以方便地构造一个表单 ...
- 利用bootsrap控件 实现文件上传功能
源代码实例:https://github.com/kartik-v/bootstrap-fileinput 一.jsp页面 <%@ page language="java" ...
- form里面文件上传并预览
其实form里面是不能嵌套form的,如果form里面有图片上传和其他input框,我们希望上传图片并预览图片,然后将其他input框填写完毕,再提交整个表单的话,有两种方式! 方式一:点击上传按钮的 ...
随机推荐
- PDF 生成插件 flying saucer 和 iText
最近的项目中遇到了需求,用户在页面点击下载,将页面以PDF格式下载完成供用户浏览,所以上网找了下实现方案. 在Java世界,要想生成PDF,方案不少,所以简单做一个小结吧. 在此之前,先来勾画一下我心 ...
- 在python中处理XML
XML是实现不同语言或程序之间进行数据交换的协议,XML文件格式如下: <data> <country name="Liechtenstein"> < ...
- Git 版本控制 在 WIN 下的一些使用方法
这里记录一些 Git 在 Windows 操作系统下使用方法: 安装完毕后,先让Git 记录自己的名字: $ git config --global user.name "Your Name ...
- 关于delphi 中 Sender的学习
sender是 事件的触发者,我发现所有的组件的事件 基本上都是 传Sender. 示例效果图: 代码: 接着来,既然TButton是个类,且publish哪里有事件,我们也可以看看这个事件的原型.
- iOS nib file owner
nib文件中的file owner属性,设定后app在运行时加载nib文件的过程中会通过file owner重新建立nib文件中描述的控件与其在file owner中对应的IBOutlet或IBAct ...
- 使用nssm在windows服务器上部署nodejs
Linux上,可以轻松的使用forever或者pm2来部署nodejs应用.但是在windows下就麻烦了,pm2明确的说支持Linux & MacOS,forever在windows下貌似问 ...
- VC++ 标准C++中的string类的用法总结
相信使用过MFC编程的朋友对CString这个类的印象应该非常深刻吧?的确,MFC中的CString类使用起来真的非常的方便好用.但是如果离开了MFC框架,还有没有这样使用起来非常方便的类呢?答案是肯 ...
- ZMQ 在linux进程 和分布式之间的通信
ZMQ 在linux进程 和分布式之间的通信 待补全
- html制作,点击文字超链接显示文本框,再点击文字超链接隐藏文本框
</head><body> <script> window.onload=function(){ document.getElementById('click'). ...
- css3的2D转换
CSS3的2D转换用transform来实现 1.rotate() /*通过 rotate() 方法,元素顺时针旋转给定的角度.允许负值,元素将逆时针旋转.*/ 2.scal() /*通过 s ...