需要用到  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. noip训练 2018.10.22~2018.10.23

    day1 100+100+0=200 T1 稍微比划一下,发现其实就是缩点双,然后区间最小值的和 T2 发现答案为原lis|+1|-1 对每个点做从前最长上升序列以及从后最长下降序列, 想了半个小时怎 ...

  2. call和ret指令

    call和ret都是用来修改ip或cs:ip,可以用来实现子程序的设计:   1.ret和retf ret    ->修改ip的内容,从而实现近转移: retf    ->同时修改cs和i ...

  3. AJAX 请求完成时执行函数。Ajax 事件。

    ajaxComplete(callback) 概述 AJAX 请求完成时执行函数.Ajax 事件. XMLHttpRequest 对象和设置作为参数传递给回调函数.大理石直角尺 参数 callback ...

  4. Spring——代理实现AOP

    一.静态代理实现 1.接口(抽象主题) 2.接口的实现类(真实主题) 3.代理类(代理主题) 4.测试类: ApplicationContext context=new ClassPathXmlApp ...

  5. R-ets()

    前情需知 指数预测模型 指数模型是用来预测时序未来值的最常用模型.这类模型相对比较简单,但是实践证明它们的短期预测能力较好.不同指数模型建模时选用的因子可能不同.比如 单指数模型(simple/sin ...

  6. 20165213 Exp7 网络欺诈防范

    Exp7 网络欺诈防范 一. 实践内容 简单应用SET工具建立冒名网站 1.首先使用sudo vi /etc/apache2/ports.conf 进行查看listen的端口号,若不是80改为80. ...

  7. js监听某个元素高度变化来改变父级iframe的高度

    最近需要做一个iframe调用其他页面内容,这个iframe地址是可变化的,但是里面的内容高度不确定且里面内容高度可调整,所以需要通过监听iframe里面body的高度变化来调整iframe的高度. ...

  8. Instances cannot be resolved and nested lifetimes cannot be created from this LifetimeScope as it has already been disposed.

    2019-07-24 11:09:15.231+08:00 LISA.Common.Utilities.LogUtil - System.ObjectDisposedException: Instan ...

  9. js如何获取鼠标位置

    获取鼠标位置,首先需要加载js文件: 然后设置一个div,给定大小: 最后进行具体操作: //首先要先设置一个div,给定大小 <div id="m"></div ...

  10. Python全栈开发第5天作业

    作业一:1) 将用户信息数据库文件和组信息数据库文件纵向合并为一个文件/1.txt(覆盖) 2) 将用户信息数据库文件和用户密码数据库文件纵向合并为一个文件/2.txt(追加) 3) 将/1.txt. ...