<div>
<input type="file" name="FileUpload" id="FileUpload" value="上传文件" />
<a onclick="uploadFile()">提交</a>
</div>
<script>

    //说明:上传文件必须为xls或xlsx格式
//input绑定change事件
var FileUpload = document.getElementById("FileUpload");
FileUpload.addEventListener("change",function(){
var name = FileUpload.files[0].name;
var i = name.lastIndexOf(".")
if(i>-1){
var ext = name.substring(i);
var index = [".xls",".xlsx"].indexOf(ext);
if(index==-1){
alert("文件格式错误")
FileUpload.value="";
}
}
}) //提交
uploadFile(){
var fileObj = document.getElementById("FileUpload").files[0]; // js 获取文件对象
if (typeof (fileObj) == "undefined" || fileObj.size <= 0) {
alert("请选择图片");
return;
}
var formFile = new FormData();
formFile.append("file", fileObj); //加入文件对象
$.ajax({
url: "",
data: formFile,
type: "Post",
dataType: "json",
cache: false,//上传文件无需缓存
processData: false,//用于对data参数进行序列化处理 这里必须false
contentType: false, //必须
success: function (result) {
alert("上传完成!");
}
})
}
</script>

FormData上传文件(input file)的更多相关文章

  1. 通过Ajax方式上传文件(input file),使用FormData进行Ajax请求

    <script type="text/jscript"> $(function () { $("#btn_uploadimg").click(fun ...

  2. 上传文件 input file

    //-----前端文件------- form id="uploadForm" enctype="multipart/form-data"> <in ...

  3. jquery即时获取上传文件input file文件名

    截图:   代码: <input type="file" id="choosefile" style="display:none"/& ...

  4. python+selenium:解决上传文件<input type='file'>标签属性被css的visibility隐藏导致无法定位元素的问题

    要想上传文件,需要找到在HTML中<input type="file" />这个标签,有它就可以利用send_keys上传文件,不过这里的<input>元素 ...

  5. 使用FormData上传文件、图片

    关于FormData XMLHttpRequest Level 2添加了一个新的接口  ---- FormData 利用FormData对象,可以通过js用一些键值对来模拟一系列表单控件,可以使用XM ...

  6. FormData上传文件 带进度条

    * jQuery ajax  FormData 上传文件 template $.ajax({ url: url, type: 'POST', data: new FormData(form), dat ...

  7. (十)HttpClient以multipart/form-data上传文件

    原文链接:https://blog.csdn.net/wsdtq123/article/details/78888734 POST上传文件 最早的HTTP POST是不支持文件上传的,给编程开发带来很 ...

  8. jQuery Ajax使用FormData上传文件和其他数据,后端web.py获取

    参考博文: 通过jQuery Ajax使用FormData对象上传文件 方法一:使用<form>表单初始化FormData对象方式上传文件 前端(JQuery): <form enc ...

  9. Ajax通过FormData上传文件

    1.使用<form>表单初始化FormData对象方式上传文件 HTML代码 <form id="uploadForm" enctype="multip ...

随机推荐

  1. kubernetes(k8s) helm安装kafka、zookeeper

    通过helm在k8s上部署kafka.zookeeper 通过helm方法安装 k8s上安装kafka,可以使用helm,将kafka作为一个应用安装.当然这首先要你的k8s支持使用helm安装.he ...

  2. [dart学习]第二篇:dart变量介绍 (一)

    前言 本文的所有内容均是官方文档的简单翻译和理解,需要查看原文,请登录  https://www.dartlang.org/guides/language/language-tour  阅读, 让我们 ...

  3. appium1.4版本,每次运行appium时需要安装unlock,setting文件的解决方法

    在使用appium执行自动化脚本时,首次运行脚本时会在手机中安装unlock,setting,inputmanager三个apk,以达到让appium控制app的目的,但是运行完一次之后,在OPPO, ...

  4. 使用CA签发的服务器证书搭建Tomcat双向SSL认证服务

    第一部分,先说证书的申请. 这步是要到正规的CA公司申请正式的设备证书必须走的步骤. 1.先生成证书的密钥对 打开命令行,切换到某个自己新建的目录下,执行如下命令 keytool -genkey -k ...

  5. 程序员 面试题【前端,java,php】

    跬步客 网址:https://www.kuibuke.com/wall/index

  6. 使用 Nginx 内置 $http_user_agent 来区分( 电脑 pc、手机 mobile、平板 pad )端的内容访问

    location / { #pc端内容访问 set $flag "pc"; set $num 1; set $hua "${http_user_agent}"; ...

  7. vue 显示 webpack-dev-server不是内部命令的解决办法

    然后在cmd中cd到项目目录,依次运行命令: npm install 和 npm run build 最后运行 npm run dev 后项目成功运行.

  8. 机器学习总结(八)决策树ID3,C4.5算法,CART算法

    本文主要总结决策树中的ID3,C4.5和CART算法,各种算法的特点,并对比了各种算法的不同点. 决策树:是一种基本的分类和回归方法.在分类问题中,是基于特征对实例进行分类.既可以认为是if-then ...

  9. Oracle使用——数据泵导入导出数据库——impdp/expdp使用

    使用前提 EXPDP和IMPDP只可以在Oracle服务端使用. EXP导出的文件只可以使用IMP导入,不适用于IMPDP导入文件:EXPDP导出的文件只可以使用IMPDP导入,而不适用于IMP导出文 ...

  10. 汇编笔记-DOSBox安装和使用(转载)

    我自己安装使用在Windwos10下面. [DOSBox简介] 1. 官方网址:http://www.dosbox.com/. 2. debug功能在win7之后系统已经不自带了,即64位系统是不能直 ...