项目是vue项目,直接贴部分代码了:

html:

<input type="file" name="fileTable"  @change="changeFile($event)" ref="fileTable">

js:

data(){
return {
fileTable:''
}
},
methods:{//导入文件
changeFile(e) {
var file = e.target.files[0]
var reader = new FileReader()
var that = this
reader.readAsDataURL(file)
reader.onload = function(e) {
that.fileTable = this.result;
that.uploadFile();
}
},
uploadFile:function(){
if (this.$refs.fileTable.files.length !== 0) {
var file = new FormData()
file.append('uploadExcel', this.$refs.fileTable.files[0])
console.log(file);
$.ajax({
url:baseUrl + '/usergroup/templateimport',
type:'post',
data:file,
datatype: 'json',
cache:false,
traditional: true,
contentType: false,
processData: false,
success: function (res) {
console.log(res);
},
error: function (error) {
console.log(error);
}
});
}
} }

使用formData上传文件,ajax上传的更多相关文章

  1. FormData对象实现文件Ajax上传

    后台: import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; imp ...

  2. models渲染字典&form表单上传文件&ajax上传文件

    {# {% for u in teacher_d.keys %}#} {# {% for u in teacher_d.values %}#} {% for k,u in teacher_d.item ...

  3. 异步上传文件,ajax上传文件,jQuery插件之ajaxFileUpload

    http://www.cnblogs.com/kissdodog/archive/2012/12/15/2819025.html 一.ajaxFileUpload是一个异步上传文件的jQuery插件. ...

  4. fromdata上传文件,ajax上传文件, 纯js上传文件,html5文件异步上传

    前端代码: 上传附件(如支付凭证等) <input type="file" name="fileUpload" id="fileUpload&q ...

  5. vue-resource+iview上传文件取消上传

    vue-resource+iview上传文件取消上传 子组件: <template> <div class="upload-area-div"> <U ...

  6. ajax:html5上传文件,上传之前可以实现本地预览

    本主题主要涉及两个新内容: 1.上传文件(主要使用了FormData) 2.本地预览(主要使用了FileReader) html5的FormData其实就是平时的Form表单,只是html5可以直接新 ...

  7. Koa - 使用koa-multer上传文件(上传限制、错误处理)

    前言 上传文件在开发中是很常见的操作,今天我选择使用koa-multer中间件来实现这一功能,除了上传文件外,我还会对文件上传进行限制,以及发生上传错误时的处理. 由于原来的 koa-multer 已 ...

  8. php 上传文件实例 上传并下载word文件

    上传界面 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3 ...

  9. ASP.NET上传文件,已经上传的大小保存在session中,在另一个页面中读取session的值不行

    想自己做个ASP.NET上传文件时显示进度条的, 按照自己的想法,其实也就是显示每次已经上传的字节,从网上找到一个方法是能够把文件变成流以后再慢慢写入的,我在那个循环写入的时候每循环一次都把已经上传的 ...

  10. php 上传文件并对上传的文件进行简单验证(错误信息,格式(防伪装),大小,是否为http上传)

    <body> <?php /** *验证错误 *如果有错,就返回错误,如果没错,就返回null */ function check($file) { //1:验证是否有误 if($f ...

随机推荐

  1. oogle advertiser api开发概述——速率限制

    速率限制 为了向遍布全球的 AdWords API 用户提供可靠的服务,我们使用令牌桶算法来衡量请求数并确定每秒查询数 (QPS) 速率.这样做的目的是阻止恶意的或不可控的软件大量入侵 AdWords ...

  2. 解决 Boost安装:fatal error: bzlib.h: No such file or directory 问题

    参考: How to install all the boost development libraries? 解决 Boost安装:fatal error: bzlib.h: No such fil ...

  3. FPGA软件使用基础之ISE下载配置 XILINX 下载器使用

    重新编辑 转载于https://www.cnblogs.com/lpp2jwz/p/7306020.html 下载程序 下载BIT 格式程序到FPGA 先插好下载器 在 ISE 中编译完 BIT 文件 ...

  4. 20. --erg--=--org--=--urg-- 做,工作 (词20、21)

    词汇速记21

  5. 【Luogu P2764】最小路径覆盖问题

    网络流 \(24\) 题之一. Problem Description 给出一个 \(n\) 个点 \(m\) 条边的 \(DAG\) ,求最小路径点覆盖,并输出路径选择方案. Input Forma ...

  6. 转 lightmap

    小记一下用法与问题,时更 surface shader就不用操心了,自带lightmap计算 主要是vertex fragment shader部分 Unity5 bake light map有三种情 ...

  7. JaveWeb 公司项目(3)----- 通过Thrift端口获取数据库数据

    前面两篇博客的内容主要是界面搭建的过程,随着界面搭建工作的完成,网页端需要加入数据,原先的B/S架构中C#通过Thrift接口获取数据,所以在网页端也沿用这个设计 首先,新建一个Maven下的Web项 ...

  8. virtualbox中的虚拟机和windows共享文件夹

    http://www.jianshu.com/p/4e3c8b06cb06 为什么要共享文件夹? 在工作的过程当中会使用到不同的软件开发环境,php的,python的,nodejs的为了隔离这些应用环 ...

  9. nginx,uwsgi,部署django,静态文件不生效问题

    打开浏览器,然后访问服务器,如果能够正常访问,并且页面链接可以跳转,但是页面却是乱的,那一定是nginx.conf里面的静态文件配置不正确, location /static/ {#expires 3 ...

  10. JNI手动释放内存(避免内存泄露)

    . 哪些需要手动释放? 不要手动释放(基本类型): jint , jlong , jchar 需要手动释放(引用类型,数组家族): jstring,jobject ,jobjectArray,jint ...