首先创建一个formData,其中参数,就是你的form表单,jquery要加0,也可以用document.querySelector("form")得到

var formData = new FormData($("form")[0]);

接着就是异步上传了,其中一定要设置两个值为falese,就是下面的contentType和processData,使之可以上传文件,并不要转成字符串形式,这也是为什么要用$.ajax而不用$.post的原因

$.ajax({
url: "/base/test",
type: 'POST',
data: formData,
contentType: false,
processData: false,
success: function (returndata) {
console.log(returndata);
},
error: function (returndata) {
console.log(returndata);
}
});

上面的url,自行设置,是你要处理的链接。使用这种方法的好处就是不用通过FileReader读取,再转换数据!不过为了实时显示图片,也可以结合filereader使用

jquery运用FormData结合Ajax异步上传表单,超实用的更多相关文章

  1. html5图片异步上传/ 表单提交相关

    1 form 表单 get/post提交时候. action地址(或者啥ajax的url地址) 会涉及到跨域问题 常见跨域问题http://www.cnblogs.com/rainman/archiv ...

  2. Ajax同时上传表单序列化参数+自定义参数

    $.ajax({ type:'POST', url :"<{:U('jiuzhu/edit')}>", data:$.param({'name1':value1,'na ...

  3. html5+php实现文件的断点续传ajax异步上传

    html5+php实现文件的断点续传ajax异步上传 准备知识:断点续传,既然有断,那就应该有文件分割的过程,一段一段的传.以前文件无法分割,但随着HTML5新特性的引入,类似普通字符串.数组的分割, ...

  4. 基于Flask开发网站 -- 前端Ajax异步上传文件到后台

    大家好,我是辰哥~ 辰哥最近利用空闲时间在写一个在线可视化平台,过程中也觉得一些技术还是比较有意思的,所以就以模块化的形式分享出来.如:从网页界面(前端)上传文件到服务器(后端). 放一下该模块的界面 ...

  5. java使用xheditor Ajax异步上传错误

    java使用xheditor Ajax异步上传时候错误如下:the request doesn't contain a multipart/form-data or multipart/mixed s ...

  6. Spring使用ajax异步上传文件

    单文件上传 <!-- 创建文件选择框 --> 文件上传 :<input type="file" id="file" name="fi ...

  7. ajax异步上传文件和表单同步上传文件 的区别

    1. 用表单上传文件(以照片为例)-同步上传 html部分代码:这里请求地址index.php <!DOCTYPE html> <html lang="en"&g ...

  8. 利用struts2进行单个文件,批量文件上传,ajax异步上传以及下载

    利用struts2进行单个文件,批量文件上传,ajax异步上传以及下载 1.页面显示代码 <%@ page language="java" import="java ...

  9. 【文件上传】文件上传的form表单提交方式和ajax异步上传方式对比

    一.html 表单代码 …… <input type="file" class="file_one" name="offenderExcelFi ...

随机推荐

  1. Shell 基础教程

    一个比较好的shell基础教程: http://www.runoob.com/linux/linux-shell.html

  2. PLSQL安装、PLSQL汉化、激活

    前言 新版PLSQL连接Oracle时,不需要Oracle客户端为32位了,安装完Oracle后也不需要在单独安装客户端. 一.准备工作 1.点击下载PLSQL,本次安装的PLSQL版本为12.0.7 ...

  3. installshield安装包制作

    入门教程:http://blog.csdn.net/gaofang2009/article/details/5260065 入门教程:http://blog.csdn.net/plfl520/arti ...

  4. Alpha 事后诸葛亮(团队)

    前言 事后诸葛亮?作业名真的不好听,下一届还要沿用吗? 队名:小白吃 通向hjj博客的任意门 思考总结 设想和目标 我们的软件要解决什么问题?是否定义得很清楚?是否对典型用户和典型场景有清晰的描述? ...

  5. mysql的表映射

    参考博客:https://blog.csdn.net/shushugood/article/details/79925150 1.服务器上的操作 在服务器上mysql创建一个实例,名为test_db, ...

  6. OpenCV3编程入门-读书笔记2-core组件

    一.颜色空间缩减 1.概念 如果图像是3通道,深度为1个字节,则每个像素有256*256*256种可能值,这么多的可能值会对算法性能造成严重影响.利用颜色空间缩减就能解决这个问题,例如将颜色值0~9取 ...

  7. noj算法 8皇后打印 回溯法

    描述: 输出8皇后问题所有结果. 输入: 没有输入. 输出: 每个结果第一行是No n:的形式,n表示输出的是第几个结果:下面8行,每行8个字符,‘A’表示皇后,‘.’表示空格.不同的结果中,先输出第 ...

  8. 【java】Java组件概览(1)

    如上图所示,Oracle的Java SE8有两个产品:JDK和JRE.其中,JRE的内容包括图中①~⑤,它是JDK的子集. ⑥中的红色部分与JRE有重合. [参考] 1.https://docs.or ...

  9. Java_数据类型

    变量就是申请内存来存储值. java的两大数据类型:内置数据类型和引用数据类型 数据类型 6种数据类型(4种整数型,2种浮点型),一种字符类型,一种布尔类型 数据类型 位数 描述 byte 8位 -1 ...

  10. ExtJs5的基本理论概念

    概述 理解ExtJs里面的一些基本关键字的概念是使用ExtJs搭建MMVC框架的基础,在ExtJs中,我们通常遇到ExtJs的配置和启动项Ext.application(),该方法是ExtJs程序初始 ...