需要用到  FormData。

html:

<form id="formPost">
  name: <input name="name" />
memo: <input name="memo" />
  file: <input type="file" name="photos[]" />
  file: <input type="file" name="photos[]" />
  file: <input type="file" name="photos[]" />
</form>

js:

let formData = new FormData($('#formPost')[0]);

假如这时候又有一个字段 class 来了

formData.append("class","三年级一班");  // class是键,三年级一班是是值。

查看添加到formData的值

for (let [a, b] of formData.entries()) {
console.log(a, b);
}

打印出来的大概长这样

ajax提交

$.ajax({
url:url,
type: 'post',
data: formData,
processData: false, //告诉jQuery不要去处理发送的数据
contentType: false, //告诉jQuery不要去设置Content-Type请求头
success:function(res){
     console.log(res);
...
}
})

ajax提交表单包含文件的更多相关文章

  1. ajax提交表单,支持文件上传

    当我们提交表单但是又不想要刷新页面的时候就可以考虑使用ajax来实现提交功能,但是这有个局限就是当有文件上传的时候是行不通的,下面借助于jquery.form可以很方便满足我们的需求.   1.表单写 ...

  2. ajax提交表单包括文件

    <script src="${pageContext.request.contextPath}/assets/js/jquery-1.8.3.js"></scri ...

  3. ajax提交表单、ajax实现文件上传

    ajax提交表单.ajax实现文件上传,有需要的朋友可以参考下. 方式一:利用from表单的targer属性 + 隐藏的iframe 达到类似效果, 支持提交含有文件和普通数据的复杂表单 方式二:使用 ...

  4. php使用jquery Form ajax 提交表单,并上传文件

    在html5中我们通过FormData就可以ajax上传文件数据,不过因为兼容问题.我们选用jquery.form.min.js来进行ajax的表单提交.   一.jquery.form.js下载地址 ...

  5. 关于ajax提交表单的一些实例及遇到的问题和解决办法

    ajax提交的表单有两种情况: 第一种:input type类型没有file上传文件类型的表单 第二种:input type类型有file上传文件类型的表单 之所以分为两种:是因为原生ajax是不能提 ...

  6. JQuery ajax提交表单及表单验证

    JQuery ajax提交表单及表单验证 博客分类: jsp/html/javascript/ajax/development Kit 开源项目   注:经过验证,formValidator只适合一个 ...

  7. ajax提交表单,包括跳入的坑!

    本来今天上午写了一个js执行上下文的一个了解.但是写一大半的时候出去有事,电脑关了啥都没了. 还是让我们进入正题 ajax提交表单,很简单,原生js的代码太复杂,我们就jq的去写. 创建html文件, ...

  8. Jquery ajax提交表单几种方法

    在jquery中ajax提交表单有post与get方式,在使用get方式时我们可以直接使用ajax 序列化表单$('#表单ID').serialize();就行了,下面我来介绍两个提交表单数据的方法. ...

  9. Validator验证Ajax提交表单的方法

    Validator验证Ajax提交表单的方法 转自:http://hunanpengdake.iteye.com/blog/1671360 当我们在一些稍微复杂的业务时,可能会遇到需要多个表单form ...

随机推荐

  1. 【51nod 2004】终结之时

    题目大意 "将世界终结前最后的画面,深深刻印进死水般的心海." 祈愿没有得到回应,雷声冲破云霄,正在祈愿的洛天依受到了极大的打击. 洛天依叹了口气,说:"看来这个世界正如 ...

  2. HDU 6045 - Is Derek lying | 2017 Multi-University Training Contest 2

    /* HDU 6045 - Is Derek lying [ 分析 ] 题意: 有N个问题, 每个问题有A,B,C三种答案,答对加一分,答错不加分 给出甲乙两人的答案,给出两人的分数先x, y,问分数 ...

  3. uniapp在在页面跳转时,若URL太长的字符串会导致数据传递失败

    url有长度限制,太长的字符串会传递失败,可使用窗体通信.全局变量,或encodeURIComponent等多种方式解决,如下为encodeURIComponent示例的解决方法. <navig ...

  4. windows 控制台 命令行指令换行

    由于屏幕较小而指令太长,在书写的时候不好阅读. 其实cmd和Linux一样可以通过特殊符号换行的: Linux 为 \ 而cmd 为 ^         看图 这就很美观了,拯救了我的强迫症 ^_^ ...

  5. jQuery 3.0 的新特性

    1. jQuery 3.0 运行在严格模式下 当下几乎支持jQuery 3.0的浏览器都支持严格模式,该版本正是基于此进行编译发布的. 你的代码已经运行在非严格模式?不用担心,你无需重写.jQuery ...

  6. PHP回顾(4)文件相关函数

    touch()          创建文件 (修改时间,不存在时创建) copy()            复制文件,复制过程中可以修改文件名 rename()        重命名 或  移动文件  ...

  7. noi.ac #546 分组

    题目链接:戳我 题目描述 现在有n个字符串,你需要从中选出一些字符串,使得选出的字符串能被分组,满足每组大小为2,且可以从每组选出该组的两个字符串的一个非空公共后缀,使得每组选出的串互不相同. 输入格 ...

  8. 数据分析-excel数据分析(数据分析师岗位分析)

    使用的函数:字符截取函数:LEFT(),MID()  定位函数:FIND()   统计函数:COUNTIF() 1.获取薪资的区间的最小值min和最大值max 处理方法:新插入多列,使用find()定 ...

  9. SRS之SrsConfig类

    1. 类定义 1.1 SrsConfig 类 /** * the config service provider. * for the config supports reload, so never ...

  10. DP&图论 DAY 6 上午

    DP&图论  DAY 6  上午 双连通分量 从u-->v不存在必经边,点 点双连通分量 边双连通分量 点/边双连通分量缩点之后变成一个树 找连通块的时候不越过割点或者桥 P3469 [ ...