使用 jQuery.ajax 上传带文件的表单遇到的问题


Posted in Javascript onOctober 31, 2016

今天帮人看代码的时候,遇到一点小问题。使用 jQuery 上传带文件的表单时,会有些问题。

首先,因为使用的是 FormData,所以必须在传入 $.ajax 的参数中配置 processData: false。

否则将会抛出 Illegal invocation 的异常,因为 jQuery 默认是会对传入的 data 字段的数据进行处理的。

官方文档是这么解释的:

使用 jQuery.ajax 上传带文件的表单遇到的问题

其次,注意请求的 Content-Type 首部,默认是 application/x-www-form-urlencoded; charset=UTF-8,也就是我们通常见的 “a=A&b=B” 这种格式。但使用 FormData 时,就不行了。

对参数添加 contentType 字段,将其值设置为 false 即可。如果 jQuery 版本小于 1.6,则手动设置为 multipart/form-data。具体说明请见文档说明:

使用 jQuery.ajax 上传带文件的表单遇到的问题

我以前通常都是使用原生的 XMLHttpRequest,所以倒也没有遇到过这种问题。既然遇到了,就得解决。因此记录下来,以备日后查找。

以上所述是小编给大家介绍的使用 jQuery.ajax 上传带文件的表单遇到的问题,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
一段多浏览器的"复制到剪贴板"javascript代码
Mar 27 Javascript
firefox火狐浏览器与与ie兼容的2个问题总结
Jul 20 Javascript
JQuery获取当前屏幕的高度宽度的实现代码
Jul 12 Javascript
js 分页全选或反选标识实现代码
Aug 09 Javascript
js判断一个字符串是以某个字符串开头的简单实例
Dec 27 Javascript
JS实现课堂随机点名和顺序点名
Mar 09 Javascript
微信小程序中做用户登录与登录态维护的实现详解
May 17 Javascript
详解如何在 vue 项目里正确地引用 jquery 和 jquery-ui的插件
Jun 01 jQuery
jQuery实现可兼容IE6的淡入淡出效果告警提示功能示例
Sep 20 jQuery
vue2.0在table中实现全选和反选的示例代码
Nov 04 Javascript
vue+iview 实现可编辑表格的示例代码
Oct 31 Javascript
ng-alain的sf如何自定义部件的流程
Jun 12 Javascript
微信小程序 开发工具快捷键整理
Oct 31 #Javascript
微信小程序 实现tabs选项卡效果实例代码
Oct 31 #Javascript
HTML5基于Tomcat 7.0实现WebSocket连接并实现简单的实时聊天
Oct 31 #Javascript
jQuery绑定事件的四种方式介绍
Oct 31 #Javascript
JS 实现导航菜单中的二级下拉菜单的几种方式
Oct 31 #Javascript
JS中作用域和变量提升(hoisting)的深入理解
Oct 31 #Javascript
jsp 网站引入外部css或者js失效问题解决
Oct 31 #Javascript
You might like
ThinkPHP在Cli模式下使用模板引擎的方法
2015/09/25 PHP
php文档工具PHP Documentor安装与使用方法
2016/01/25 PHP
基于thinkPHP实现的微信自定义分享功能示例
2016/09/23 PHP
ExtJs设置GridPanel表格文本垂直居中示例
2013/07/15 Javascript
js中cookie的添加、取值、删除示例代码
2013/10/21 Javascript
javascript实现随机读取数组的方法
2015/08/03 Javascript
基于jQuery实现在线选座之高铁版
2015/08/24 Javascript
轻松学习Javascript闭包函数
2015/12/15 Javascript
基于jQuery的Web上传插件Uploadify使用示例
2016/05/19 Javascript
AngularJs Managing Service Dependencies详解
2016/09/02 Javascript
bootstrap table配置参数例子
2017/01/05 Javascript
微信小程序 request接口的封装实例代码
2017/04/26 Javascript
详解webpack进阶之loader篇
2017/08/23 Javascript
axios发送post请求springMVC接收不到参数的解决方法
2018/03/05 Javascript
JavaScript实现的级联算法示例【省市二级联动功能】
2018/12/25 Javascript
es6数组之扩展运算符操作实例分析
2020/04/25 Javascript
python 字典(dict)按键和值排序
2016/06/28 Python
Python根据当前日期取去年同星期日期
2019/04/14 Python
Python综合应用名片管理系统案例详解
2020/01/03 Python
python 装饰器功能与用法案例详解
2020/03/06 Python
Python使用Paramiko控制liunx第三方库
2020/05/20 Python
快速了解Python开发环境Spyder
2020/06/29 Python
keras的ImageDataGenerator和flow()的用法说明
2020/07/03 Python
python使用yaml 管理selenium元素的示例
2020/12/01 Python
python判断all函数输出结果是否为true的方法
2020/12/03 Python
python FTP编程基础入门
2021/02/27 Python
关于 HTML5 的七个传说小结
2012/04/12 HTML / CSS
详解HTML5将footer置于页面最底部的方法(CSS+JS)
2018/10/11 HTML / CSS
乌克兰巴士票购买网站:inBus
2021/03/12 全球购物
五水共治捐款倡议书
2014/05/14 职场文书
优秀的应届生自荐信
2014/05/23 职场文书
发展党员工作情况汇报
2014/10/28 职场文书
考研复习计划
2015/01/19 职场文书
2015年志愿者服务工作总结
2015/04/20 职场文书
Python中的协程(Coroutine)操作模块(greenlet、gevent)
2022/05/30 Python
windows server2008 开启端口的实现方法
2022/06/25 Servers