jQuery 利用$.ajax 时获取原生XMLHttpRequest 对象的方法


Posted in Javascript onAugust 25, 2016

废话不多说了,关键代码如下所示:

<script> 
$('.screenshot_input').change(function (){ 
//获取file对象 即相当于可以直接post的$_FILES数据 
var domFile = $(this)[0].files[0] 
var domForm = $('#testForm')[0] 
//将form对象直接作为参数 new FormData对象 
var formData = new FormData(domForm); 
//追加file 对象 
formData.append('file',domFile); 
$.ajax({ 
url:'{{ path( 'acme_admin_app_dealAppScreenShot') }}', 
type: "POST", 
data: formData, 
processData: false, // tell jQuery not to process the data 
contentType: false, // tell jQuery not to set contentType 
xhr: function(){ //这是关键 获取原生的xhr对象 做以前做的所有事情 
var xhr = jQuery.ajaxSettings.xhr(); 
xhr.upload.onload = function (){ 
alert('finish downloading') 
} 
xhr.upload.onprogress = function (ev) { 
if(ev.lengthComputable) { 
var percent = 100 * ev.loaded/ev.total; 
console.log(percent,ev) 
} 
} 
return xhr; 
}, 
success:function(data){ 
alert(data) 
} 
}) 
}) 
</script> 
Array 
( 
[name] => cooff 
[email] => qq.comaa 
) 
Array 
( 
[file] => Array 
( 
[name] => yunce2.0测试.apk 
[type] => application/vnd.android.package-archive 
[tmp_name] => /tmp/php4Jxt0c 
[error] => 0 
[size] => 6476627 
) 
)

一次过把form表单 和 file 对象发送到PHP后端controller 处理起来非常方便。

以上所述是小编给大家介绍的jQuery 利用$.ajax 时获取原生XMLHttpRequest 对象,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
Javascript模块化编程(三)require.js的用法及功能介绍
Jan 17 Javascript
JS中类或对象的定义说明
Mar 10 Javascript
jquery动态分页效果堪比时光网
Sep 25 Javascript
jQuery通过Ajax返回JSON数据
Apr 28 Javascript
jQuery插件FusionCharts绘制的2D帕累托图效果示例【附demo源码】
Mar 28 jQuery
AngularJS 单选框及多选框的双向动态绑定
Apr 20 Javascript
微信小程序自定义模态对话框实例详解
Aug 16 Javascript
JQuery选中select组件被选中的值方法
Mar 08 jQuery
AngularJS 事件发布机制
Aug 28 Javascript
node.js ws模块搭建websocket服务端的方法示例
Apr 25 Javascript
浅谈layui使用模板引擎动态渲染元素要注意的问题
Sep 14 Javascript
Vue el-autocomplete远程搜索下拉框并实现自动填充功能(推荐)
Oct 25 Javascript
轻松掌握JavaScript策略模式
Aug 25 #Javascript
Javascript 6里的4个新语法
Aug 25 #Javascript
Javascript实现代码折叠功能
Aug 25 #Javascript
深入浅出ES6之let和const命令
Aug 25 #Javascript
PhotoSwipe异步动态加载图片方法
Aug 25 #Javascript
相册展示PhotoSwipe.js插件实现
Aug 25 #Javascript
移动端点击图片放大特效PhotoSwipe.js插件实现
Aug 25 #Javascript
You might like
PHP中路径问题的解决方案
2006/10/09 PHP
在CentOS系统上从零开始搭建WordPress博客的全流程记录
2016/04/21 PHP
PHP实现链式操作的原理详解
2016/09/16 PHP
ASP.NET中使用后端代码注册脚本 生成JQUERY-EASYUI的界面错位的解决方法
2010/06/12 Javascript
js调试工具console.log()方法查看js代码的执行情况
2014/08/08 Javascript
Node.js巧妙实现Web应用代码热更新
2015/10/22 Javascript
JavaScript中获取Radio被选中的值
2015/11/11 Javascript
JavaScript阻止回车提交表单的方法
2015/12/30 Javascript
Angularjs material 实现搜索框功能
2016/03/08 Javascript
原生JS实现-星级评分系统的简单实例
2016/08/21 Javascript
JS获取一个表单字段中多条数据并转化为json格式
2017/10/17 Javascript
Vue从TodoList中学父子组件通信
2019/02/05 Javascript
vue引入微信sdk 实现分享朋友圈获取地理位置功能
2019/07/04 Javascript
解决Layui中layer报错的问题
2019/09/03 Javascript
vue2.0 获取从http接口中获取数据,组件开发,路由配置方式
2019/11/04 Javascript
Vue + Element-ui的下拉框el-select获取额外参数详解
2020/08/14 Javascript
vue3.0+vue-router+element-plus初实践
2020/12/02 Vue.js
JavaScript实现跟随鼠标移动的盒子
2021/01/28 Javascript
[01:01:43]EG vs VP 2018国际邀请赛淘汰赛BO3 第二场 8.24
2018/08/25 DOTA
windows系统中python使用rar命令压缩多个文件夹示例
2014/05/06 Python
Python字符串替换实例分析
2015/05/11 Python
Python实现随机选择元素功能
2017/09/14 Python
Python读取图片为16进制表示简单代码
2018/01/19 Python
django 修改server端口号的方法
2018/05/14 Python
详解python函数的闭包问题(内部函数与外部函数详述)
2019/05/17 Python
Pandas缺失值2种处理方式代码实例
2020/06/13 Python
ECCO爱步官方旗舰店:丹麦鞋履品牌
2018/01/02 全球购物
美国家居装饰网上商店:Lulu & Georgia
2019/09/14 全球购物
专业幼师实习生自我鉴定范文
2013/12/08 职场文书
40岁生日感言
2014/02/15 职场文书
《美丽的彩虹》教学反思
2014/02/25 职场文书
食品销售计划书
2014/04/26 职场文书
运动会广播稿150字(9篇)
2014/09/20 职场文书
浅谈Redis在直播场景的实践方案
2021/04/27 Redis
MySQL5.7并行复制原理及实现
2021/06/03 MySQL
使用compose函数优化代码提高可读性及扩展性
2022/06/16 Javascript