使用 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 相关文章推荐
IE6、IE7中获取Button元素的值的bug说明
Aug 28 Javascript
jQuery EasyUI API 中文文档 - ValidateBox验证框
Oct 06 Javascript
Jquery.Form 异步提交表单的简单实例
Mar 03 Javascript
浅谈js之字面量、对象字面量的访问、关键字in的用法
Nov 20 Javascript
javaScript+turn.js实现图书翻页效果实例代码
Feb 16 Javascript
全面解析jQuery中的$(window)与$(document)的用法区别
Aug 15 jQuery
微信小程序中使用Promise进行异步流程处理的实例详解
Aug 17 Javascript
妙用缓存调用链实现JS方法的重载
Apr 30 Javascript
浅谈Vue.js路由管理器 Vue Router
Aug 16 Javascript
vue富文本编辑器组件vue-quill-edit使用教程
Sep 21 Javascript
JS图片懒加载技术实现过程解析
Jul 27 Javascript
javascript实现倒计时提示框
Mar 02 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
超人钢铁侠联手合作?美漫作家呼吁DC漫威合作联动以抵抗疫情
2020/04/09 欧美动漫
新的一年,新的期待:DC在2020年的四部动画电影
2020/01/01 欧美动漫
PHP 模拟登陆MSN并获得用户信息
2009/05/16 PHP
mysqli_set_charset和SET NAMES使用抉择及优劣分析
2013/01/13 PHP
php使用文本统计访问量的方法
2016/05/12 PHP
php similar_text()函数的定义和用法
2016/05/12 PHP
Yii2框架控制器、路由、Url生成操作示例
2019/05/27 PHP
Laravel 6.2 中添加了可调用容器对象的方法
2019/10/22 PHP
ThinkPHP5.1+Ajax实现的无刷新分页功能示例
2020/02/10 PHP
理清apply(),call()的区别和关系
2011/08/14 Javascript
jQuery截取指定长度字符串的实现原理及代码
2014/07/01 Javascript
判断浏览器的内核及版本号方法汇总
2015/01/05 Javascript
javascript委托(Delegate)blur和focus用法实例分析
2015/05/26 Javascript
javascript创建对象的几种模式介绍
2016/05/06 Javascript
JS留言功能的简单实现案例(推荐)
2016/06/23 Javascript
javascript中的 object 和 function小结
2016/08/14 Javascript
JavaScript之cookie技术详解
2016/11/18 Javascript
防止重复发送 Ajax 请求
2017/02/15 Javascript
vue-cli+webpack在生成的项目中使用bootstrap实例代码
2017/05/26 Javascript
详解vue.js的devtools安装
2017/05/26 Javascript
vue-router实现编程式导航的代码实例
2019/01/19 Javascript
Node.js从字符串生成文件流的实现方法
2019/08/18 Javascript
vue任意关系组件通信与跨组件监听状态vue-communication
2020/10/18 Javascript
python中字典(Dictionary)用法实例详解
2015/05/30 Python
Python自动化测试Eclipse+Pydev 搭建开发环境
2016/08/15 Python
Python 操作MySQL详解及实例
2017/04/30 Python
Django使用Channels实现WebSocket的方法
2019/07/28 Python
Jupyter Notebook安装及使用方法解析
2020/11/12 Python
CSS3制作炫酷带方向感应的鼠标滑过图片3D动画
2016/03/16 HTML / CSS
全球最大运动品牌的男装、女装和童装官方库存商:A&A Sports
2021/01/17 全球购物
工作中的自我评价如何写好
2013/10/28 职场文书
网页美工求职信
2014/02/15 职场文书
公司委托书怎么写
2014/08/02 职场文书
迎国庆演讲稿
2014/09/15 职场文书
农村老人去世追悼词
2015/06/23 职场文书
初一英语教学反思
2016/02/15 职场文书