使用 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 中介者模式实例
Dec 16 Javascript
jquery中获取select选中值的代码
Jun 27 Javascript
php析构函数的具体用法小结
Mar 11 Javascript
jQuery中removeData()方法用法实例
Dec 27 Javascript
JavaScript将数字转换成大写中文的方法
Mar 23 Javascript
input点击后placeholder中的提示消息消失
Jan 15 Javascript
AngularJS中的过滤器filter用法完全解析
Apr 22 Javascript
JavaScript中this的四个绑定规则总结
Sep 26 Javascript
JavaScript 最佳实践:帮你提升代码质量
Dec 03 Javascript
bootstrap IE8 兼容性处理
Mar 22 Javascript
JavaScript实现简单的文本逐字打印效果示例
Apr 12 Javascript
修改npm全局安装模式的路径方法
May 15 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
Snoopy类使用小例子
2008/04/15 PHP
php创建和删除目录函数介绍和递归删除目录函数分享
2014/11/18 PHP
php使用unset()删除数组中某个单元(键)的方法
2015/02/17 PHP
Zend Framework教程之前端控制器Zend_Controller_Front用法详解
2016/03/07 PHP
PHP实现上传多文件示例代码
2017/02/20 PHP
豆瓣网的jquery代码实例
2008/06/15 Javascript
jquery用get实现ajax在ie里面刷新不进入后台解决方法
2013/08/12 Javascript
JQuery中操作Css样式的方法
2014/02/12 Javascript
jQuery 隐藏和显示 input 默认值示例
2014/06/03 Javascript
jQuery浏览器CSS3特写兼容实例
2015/01/19 Javascript
js图片轮播手动切换效果
2015/11/10 Javascript
jQuery事件绑定on()与弹窗实现代码
2016/04/28 Javascript
原生js代码实现图片放大境效果
2016/10/30 Javascript
protractor的安装与基本使用教程
2017/07/07 Javascript
分析JS单线程异步io回调的特性
2017/12/01 Javascript
angularjs实现的购物金额计算工具示例
2018/05/08 Javascript
NodeJS如何实现同步的方法示例
2018/08/24 NodeJs
JS实现点击按钮随机生成可拖动的不同颜色块示例
2019/01/30 Javascript
js页面加载后执行的几种方式小结
2020/01/30 Javascript
JavaScript进阶(四)原型与原型链用法实例分析
2020/05/09 Javascript
Python中for循环详解
2014/01/17 Python
python类和函数中使用静态变量的方法
2015/05/09 Python
Python 出现错误TypeError: ‘NoneType’ object is not iterable解决办法
2017/01/12 Python
python3.5 + PyQt5 +Eric6 实现的一个计算器代码
2017/03/11 Python
基于python 爬虫爬到含空格的url的处理方法
2018/05/11 Python
Python解决走迷宫问题算法示例
2018/07/27 Python
pandas数据处理之绘图的实现
2020/06/15 Python
浅谈CSS3 box-sizing 属性 有趣的盒模型
2019/04/02 HTML / CSS
美国网上鞋子零售商:Dr. Scholl’s Shoes
2017/11/17 全球购物
数控专业毕业生自荐信范文
2014/03/04 职场文书
国庆节促销广告语2014
2014/09/19 职场文书
大学生求职自荐信
2015/03/24 职场文书
中职班主任培训心得体会
2016/01/07 职场文书
党员理论学习心得体会
2016/01/21 职场文书
Python中Cookies导出某站用户数据的方法
2021/05/17 Python
Pytorch中的数据集划分&正则化方法
2021/05/27 Python