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 ...
随机推荐
- Spring+Hibernate+Struts(SSH)框架整合
SSH框架整合 前言:有人说,现在还是流行主流框架,SSM都出来很久了,更不要说SSH.我不以为然.现在许多公司所用的老项目还是ssh,如果改成流行框架,需要成本.比如金融IT这一块,数据库dao层还 ...
- phpadmin增加使得项目能连接数据库
感谢:http://jingyan.baidu.com/article/e4511cf332b9832b845eaf27.html 值得注意: 1.phpadmin的目录:D:\developsoft ...
- Spring Security入门(3-7)Spring Security处理页面的ajax请求
- gradle入门(1-3)使用gradle开发一个发布版本
需求描述 1.使用Maven central仓库.2.使用Log4j写入日志.3.包含单元测试,保证正确的信息返回,单元测试必须使用JUnit编写.4.创建一个可执行的Jar文件. 我们来看一下怎样实 ...
- JSON(五)——同步请求中使用JSON格式字符串进行交互(不太常见的用法)
在同步请求中使用JSON格式进行数据交互的场景并不多,同步请求是浏览器直接与服务器进行数据交互的大多是用jsp的标签jstl和el表达式对请求中的数据进行数据的渲染.我也是在一次开发中要从其它服务器提 ...
- final类与final方法
inal---用于类.方法前. final类---不可被继承. final方法---不可被覆盖. final类不能被继承. 如果我们不希望一个类被继承,我们使用final来修饰这个类.这个类将无法被继 ...
- oracle中求1到100之间的质数和
declare i number:=1; j number:=0; sum1 number:=0;begin while(i<100) loop i:=i+1; j:=2; while(mod( ...
- Hive:添加、删除分区
添加分区: ', p_loctype='MHA'); 已经创建好的分区表: INFO : Loading partition {p_hour, p_city, p_loctype=MHA} INFO ...
- JProfiler简明使用教程
JProfile是一款性能瓶颈分析工具,监控粒度可以细化到某一个类包,堪称神器!我安装了一下9.11的版本,并简单说说使用方法. 1:创建一个监控任务 2:选择tomcat版本 3:监控远程服务器 4 ...
- 在MySQL中使用子查询
子查询作为数据源 子查询生成的结果集包含行.列数据,因而非常适合将它与表一起包含在from子句的子查询里.例: SELECT d.dept_id, d.name, e_cnt.how_many num ...