flask jQuery ajax 上传文件
1、html 代码
<div>
<form id="uploadForm" enctype="multipart/form-data" >
<div>
<input type="file" name="file" value="" style="color: white">
<input type="button" value="上传" id="upFileBtn">
</div>
</form>
</div>
注:1、html 部分主要是一个form表单,其中表单的enctype = "multipart/form-data" 必须要有。
2、由于我的页面背景颜色设置成黑色,所以字体颜色选了白色,这个无伤大雅。
2、js代码
var up_file = function () {
var formData = new FormData($('#uploadForm')[0]);
$.ajax({
url:"/test/up_file",
type: "POST",
data: formData,
async: true,
cashe: false,
contentType:false,
processData:false,
success:function (returndata) {
alert(returndata)
},
error: function (returndata) {
alert("上传失败!")
})
注:如果要用ajax上传文件,则要用FormData将文件转化为FormData对象。
3、flask部分
@test.route('/up_file', methods=['GET', 'POST'])
def up_file():
if request.method == "POST":
file = request.files['file']
# file_name = "test.csv"
file_name = file.filename
file.save(os.path.join('templates\\files', file_name))
return '上传成功'
注:1、本文没有将蓝本部分写出来,相信路由的配置还是不难的。
2、本代码将文件存在服务器的templates下files文件夹中,可以直接给文件取个新名字,也可以用rerquest.files['file'].filename获取上传文件时的名字。
flask jQuery ajax 上传文件的更多相关文章
- IE8/9 JQuery.Ajax 上传文件无效
IE8/9 JQuery.Ajax 上传文件有两个限制: 使用 JQuery.Ajax 无法上传文件(因为无法使用 FormData,FormData 是 HTML5 的一个特性,IE8/9 不支持) ...
- jQuery ajax上传文件实例
jQuery ajax上传文件实例 <form id="form" enctype="multipart/form-data"><input ...
- jquery ajax 上传文件
html:<!-- /.tab-pane --> <div class="tab-pane" id="head_portrait"> & ...
- jquery ajax 上传文件和传递参数到一个接口的实现方法
参考:https://blog.csdn.net/qq_15674631/article/details/81095284 参考:https://www.jianshu.com/p/46e6e03a0 ...
- ASP.NET Jquery+ajax上传文件(带进度条)
效果图 支持ie6+,chrome,ie6中文文件名会显示乱码. 上传时候会显示进度条. 需要jquery.uploadify.js插件,稍后会给出下载 前台代码 <%@ Page Langua ...
- jQuery Ajax 上传文件改进
如果用户取消上传后 背景 提示自动消失了.... 修正Bug.... 同时也更新了不同上传类型的提示字体大小... 2017-05-26 增加了鼠标释放提示 先看之前的效果: 再看现在的效果: 升级 ...
- jQuery Ajax 上传文件夹及文件
我们先来看一下文件夹结构 这是上传处理的: 看一下系统日志: 升级 HTML5文件实现拖拽上传提示效果改进(支持三种状态提示) 拖拽过程详解: 1:文件未拖出文件选择框的时候提示:将要上传的文件或文件 ...
- asp.net 中使用JQuery Ajax 上传文件
首先创建一个网页,网页中添加如下代码. <h3>Upload File using Jquery AJAX in Asp.net</h3> <table> < ...
- jQuery Ajax上传文件
JS代码: //保存 function btnAdd() { var formData = new FormData($("#frm")[0]); $.ajax({ url: &q ...
随机推荐
- href的理解
您搜索的项目暂未上线,可直接<a style="color: #ff0000;" onclick="onlineTalk();" href="j ...
- 记一次oracle crs无法重启事故
今天在修改了数据库参数后,关闭数据库及crs,然后重新启动了服务器,服务器启动完成之后,发现数据库无法启动,过程如下: step1:重启数据库 $ su - grid $ srvctl stop da ...
- emqtt 试用(七)追踪
追踪 EMQ 消息服务器支持追踪来自某个客户端(Client)的全部报文,或者发布到某个主题(Topic)的全部消息. 追踪客户端(Client): ./bin/emqttd_ctl trace cl ...
- OAuth2.0学习(1-12)开源的OAuth2.0项目和比较
OAuth2.0学习(2-1)OAuth的开源项目 1.开源项目列表 http://www.oschina.net/project/tag/307/oauth?lang=19&sort=t ...
- NHibernate优点和缺点:
NHibernate优点: 1.完全的ORM框架. NHibernate对数据库结构提供了较为完整的封装,它将数据库模式映射为较完全的对象模型,支持封装,继续机制,功能较强大,比一般的ORM灵活性高. ...
- Krajee插件的用法
第一步: <!-- 必须引入 --> link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/boots ...
- python实现 双向循环链表
最近身边的朋友在研究用python来实现数据结构.遇到一个问题就是双向循环链表的实现,改指向的时候总是发蒙. 我自己尝实现了一个python的双向循环链表.附上代码,希望对大家有帮助. 如果不懂什么是 ...
- 理解Node.js安装及模块化
1.安装Node Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境. Node.js 使用了一个事件驱动.非阻塞式 I/O 的模型,使其轻量又高效. Node.j ...
- windows系统设置虚拟机开机自启并运行虚拟系统
简述 很多用windows系统电脑开发的童鞋,会在自己电脑上装一个虚拟机,然后在装一个linux系统当作服务器来使用. 但每次电脑开机都要去重启一下虚拟机电源,实在是不划算.下面博主教大家在windo ...
- 【机器学习】Iris Data Set(鸢尾属植物数据集)
注:数据是机器学习模型的原材料,当下机器学习的热潮离不开大数据的支撑.在机器学习领域,有大量的公开数据集可以使用,从几百个样本到几十万个样本的数据集都有.有些数据集被用来教学,有些被当做机器学习模型性 ...