项目是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. Ubuntu18.04安装Android Studio

    一.安装JDK JDK下载地址:https://www.oracle.com/technetwork/java/javase/downloads/jdk11-downloads-5066655.htm ...

  2. Introducing GitFlow

    Introducing GitFlow What Is GitFlow? GitFlow is a branching model for Git, created by Vincent Driess ...

  3. Qt实在太漂亮了

    我很久之前就想用Qt,无奈对c++不熟悉,学习代价太大.想使用pyqt曲线救国,搞了好久的环境后放弃了.昨天又看了个很漂亮的qt例子,太漂亮了,让我很想进圈子.就从现在开始吧!!

  4. 通用程序返回结果类 ApplicationResult.cs

    using System.Collections.Generic; using System.Linq; namespace System { /// <summary> /// 表示应用 ...

  5. 【Cucumber】【命令行】

    知识点 参考:https://www.cnblogs.com/worklog/p/5253297.html cucumber的命令行选项 首先查看命令行选项.和其它命令行工具一样,cucumber提供 ...

  6. js,jq获取父,兄弟,子节点整理

    js获取节点 父: parentNode 获取已知节点的父节点. 子: childNodes; 得到全部子节点 children 得到全部子节点 firstChild 获得第一个子节点 lastChi ...

  7. ext4.2常用的几种弹框

    以下记录了自己在做项目时,经常用到的几种ext弹框.项目中使用的ext是4.2版本的. 1. Ext.Msg.alert() 使用此种方式时,如果提示信息过长则提示信息会被覆盖掉一部分. Ext.Ms ...

  8. ROC与AUC原理

    来自:https://blog.csdn.net/shenxiaoming77/article/details/72627882 来自:https://blog.csdn.net/u010705209 ...

  9. SQL中的float类型的数据

    问题1.  如何在SQL中默认的使用float类型的数据 SQL中想要通过计算的方式最快的得到一个float类型的数据,只需要运算的其中一个值后面加上小数点就ok. 比如 :9/2=4 但是 :9/2 ...

  10. 力扣(LeetCode)231. 2的幂

    给定一个整数,编写一个函数来判断它是否是 2 的幂次方. 示例 1: 输入: 1 输出: true 解释: 20 = 1 示例 2: 输入: 16 输出: true 解释: 24 = 16 示例 3: ...