ajax提交表单包含文件
需要用到 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提交表单包含文件的更多相关文章
- ajax提交表单,支持文件上传
当我们提交表单但是又不想要刷新页面的时候就可以考虑使用ajax来实现提交功能,但是这有个局限就是当有文件上传的时候是行不通的,下面借助于jquery.form可以很方便满足我们的需求. 1.表单写 ...
- ajax提交表单包括文件
<script src="${pageContext.request.contextPath}/assets/js/jquery-1.8.3.js"></scri ...
- ajax提交表单、ajax实现文件上传
ajax提交表单.ajax实现文件上传,有需要的朋友可以参考下. 方式一:利用from表单的targer属性 + 隐藏的iframe 达到类似效果, 支持提交含有文件和普通数据的复杂表单 方式二:使用 ...
- php使用jquery Form ajax 提交表单,并上传文件
在html5中我们通过FormData就可以ajax上传文件数据,不过因为兼容问题.我们选用jquery.form.min.js来进行ajax的表单提交. 一.jquery.form.js下载地址 ...
- 关于ajax提交表单的一些实例及遇到的问题和解决办法
ajax提交的表单有两种情况: 第一种:input type类型没有file上传文件类型的表单 第二种:input type类型有file上传文件类型的表单 之所以分为两种:是因为原生ajax是不能提 ...
- JQuery ajax提交表单及表单验证
JQuery ajax提交表单及表单验证 博客分类: jsp/html/javascript/ajax/development Kit 开源项目 注:经过验证,formValidator只适合一个 ...
- ajax提交表单,包括跳入的坑!
本来今天上午写了一个js执行上下文的一个了解.但是写一大半的时候出去有事,电脑关了啥都没了. 还是让我们进入正题 ajax提交表单,很简单,原生js的代码太复杂,我们就jq的去写. 创建html文件, ...
- Jquery ajax提交表单几种方法
在jquery中ajax提交表单有post与get方式,在使用get方式时我们可以直接使用ajax 序列化表单$('#表单ID').serialize();就行了,下面我来介绍两个提交表单数据的方法. ...
- Validator验证Ajax提交表单的方法
Validator验证Ajax提交表单的方法 转自:http://hunanpengdake.iteye.com/blog/1671360 当我们在一些稍微复杂的业务时,可能会遇到需要多个表单form ...
随机推荐
- BZOJ 4127: Abs (树链剖分 线段树求区间绝对值之和 带区间加法)
题意 给定一棵树,设计数据结构支持以下操作 1 u v d 表示将路径 (u,v) 加d(d>=0) 2 u v 表示询问路径 (u,v) 上点权绝对值的和 分析 绝对值之和不好处理,那么我们开 ...
- 【51nod 2004】终结之时
题目大意 "将世界终结前最后的画面,深深刻印进死水般的心海." 祈愿没有得到回应,雷声冲破云霄,正在祈愿的洛天依受到了极大的打击. 洛天依叹了口气,说:"看来这个世界正如 ...
- sql——limit
PageHelper: https://blog.csdn.net/baidu_38083619/article/details/82463058 Sql执行顺序: https://blog.csdn ...
- 强制类型转换之String类型
㈠布尔(Boolean)类型 布尔值只有两个,主要用来做逻辑判断 true 表示真 : false 表示假 使用typeof检查一个布尔值时,会返回boolean ㈡Null和Unde ...
- jpa单向一对多
单向一对多是一个类中的一条记录可对应另一个类的多条记录: 比如一个部门可对应多个员工: jpa中的实现步骤: one-to-many的one类中添加一个many类类型的set;比如部门类D ...
- Java多态性详解——父类引用子类对象
来源:http://blog.csdn.net/hikvision_java_gyh/article/details/8957456 面向对象编程有三个特征,即封装.继承和多态. 封装隐藏了类的内部实 ...
- C++入门经典-例6.21-比较string字符串,比较两个字符串
1:使用“>”.“!=”.“>=”等比较运算符可以比较两个字符串的内容.比较的方法是将两个string字符串从头开始比较每一个字符,直到出现两者不一致.比较这两个不相同的字符的字面值,得出 ...
- java获取本机mac物理地址
package com.simonjia.util.other; import java.net.InetAddress;import java.net.InterfaceAddress;import ...
- oc 计算 带括号 式子
下面代码实现可以计算 类似以下的字符窜. @"(1+2*(3+4)+3)/2" 自写一个简单 stack .不知道 OC为什么不提供Stack类. #import <Foun ...
- win10 c++程序打包
步骤如下: 1. 先动态编译连链接,生成exe: 2. 找到exe依赖的dll文件 使用Process Explore来获取所依赖的dll文件 打开procexp.exe,通过菜单View–Lower ...