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 ...
随机推荐
- java JDK源码解析
Hashmap 使用java语言进行系统开发时,使用得比较多得数据结构hashmap,它以[key,value],进行数据存储,通过key可以快速找到到对应的value值,但是key,value不能是 ...
- 【learning】多项式相关(求逆、开根、除法、取模)
(首先要%miskcoo,这位dalao写的博客(这里)实在是太强啦qwq大部分多项式相关的知识都是从这位dalao博客里面学的,下面这篇东西是自己对其博客学习后的一些总结和想法,大部分是按照其博客里 ...
- http客户端请求及服务端详解
http客户端请求及服务端详解 引言 HTTP 是一个属于应用层的面向对象的协议,由于其简捷.快速的方式,适用于分布式超媒体信息系统.它于1990年提出,经过几年的使用与发展,得到不断地完善和 扩展. ...
- wordpress怎么禁止文章复制
登陆你的网站后台--点击菜单栏的"外观"--点击"编辑"--在右侧,找到footer.php,打开它--在</body>之前加入以下代码: 1.禁止 ...
- 开发一个http代理服务器
参考链接: http://www.cnblogs.com/jivi/archive/2013/03/10/2952860.html https://www.2cto.com/kf/201405/297 ...
- 输入法searchLookUpEditd的使用
输入法是DevExpress系列控件比较常用的一个控件.searchLookUpEditd控件集成了快捷输入法,可以使用拼音,五笔等方式快捷输入. 先展示一下输入法的效果
- MySQLdb、 flask-MySQLdb 、MySQL-python 安装失败
今天在学习flask的时候,学习到数据库部分,连接mysql生成表,运行程序报错误:No module named MySQLdb 此时 需要安装 以下两个中任何一个 pip install flas ...
- MongoDB系列四(索引).
一.索引简介 再来老生常谈一番,什么是索引呢?数据库索引与书籍的索引类似.有了索引就不需要翻整本书,数据库可以直接在索引中查找,在索引中找到条目以后,就可以直接跳转到目标文档的位置,这能使查找速度提高 ...
- shell多进程脚本
#!/bin/bash python_path=/home/huaw/crawler python_name=list_all_v6_crawler.py MAX_SYNC_PROCESS=40 ec ...
- C# 类型、存储和变量
如果广泛地描述C和C++程序的源代码的特征,可以说C程序是一组函数和数据类型,C++程序是一组函数和类,然而C#程序是一组类型声明. 既然C#程序就是一组类型声明,那么学习C#就是学习如何创建和使用类 ...