博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
input type= file通过ajax 来异步上传
阅读量:6037 次
发布时间:2019-06-20

本文共 748 字,大约阅读时间需要 2 分钟。

hot3.png

  1. input类型设为file:
     

     

  2. 获取文件内容:

    var file = document.getElementById('fileToUpload').files[0];

     

  3. 上传: XMLHttpRequest Level 2添加了一个新的接口FormData。利用FormData对象,我们可以通过JavaScript用一些键值对来模拟一系列表单控件。比起普通的Ajax,使用FormData的最大优点就是我们可以异步上传一个二进制文件。

    // 创建 var form_data = new FormData(); // 获取文件 var file_data = $("#img_input").prop("files")[0]; // 把所以表单信息 form_data.append("id", "001"); form_data.append("name", "test"); form_data.append("img", file_data); $.ajax({   type: "POST",  url: "....",  dataType : "json",  processData: false, // 注意:让jQuery不要处理数据  contentType: false, // 注意:让jQuery不要设置  contentType data: form_data}).success(    function(msg) { console.log(msg); }   ).fail(    function(msg) { console.log(msg); }   );

     

转载于:https://my.oschina.net/u/2306318/blog/1830133

你可能感兴趣的文章
padding和margin的区别和作用及各种场合出现的bug
查看>>
Java开发中的23种设计模式详解(转)
查看>>
App测试方法总结
查看>>
分享职场心得《3》
查看>>
ModeBusRtu概述
查看>>
学习之路-现代密码学基础-001
查看>>
缓存遇到的数据过滤与分页问题
查看>>
实验05博客园总结
查看>>
(转)shell中括号的特殊用法 linux if多条件判断
查看>>
zabbix监控多tomcat实例
查看>>
CSS定宽居中的实现方案
查看>>
Elasticsearch5.x 升级
查看>>
vue中嵌套页面(iframe)
查看>>
[古怪问题] Marshal.GetActiveObject 在管理员模式下无法正常运行
查看>>
1600802047 android 第三次作业(音乐播放器)
查看>>
初窥Linux 之 最常用20条命令
查看>>
Vue优化首页加载速度 CDN引入
查看>>
DML数据操作语言之常用函数
查看>>
angular搭建
查看>>
网络编程 --ftp01上传
查看>>