formData和input的file结合使用
<form method="POST" id="uploadForm" enctype="multipart/form-data">
<input type="file" id="config" name="configFile">
<input type="file" id="demand" name="demandFile">
</form> button id="progressBtn" class="btn btn-primary">计算</button> <script>
document.querySelector("#progressBtn") = function () {
var formdata = new FormData()
formdata.append("configFile", $("#config")[0].files[0])
formdata.append("demandFile", $("#demand")[0].files[0])
$.ajax({
type: "POST",
url: "/api/computeResult",
data: formdata,
async: false,
contentType: false,
processData: false,
success: function (res) { },
error: function (res) {
}
})
} </script>
注意:
- form表单提交input的type=file时,form的enctype="multipart/form-data",才能提交file的文件流到后台
- 必须用FormData对象存储和提交表单中的值
- FormData的append方法存储表单数据
- FormData的get方法才可以看到存储到formData中的值,如formdata.get("configFile"),若是formdata.configFile是获取不到值的
- ajax中async: false
formData和input的file结合使用的更多相关文章
- HTML <input type="file">上传文件——结合asp.net的一个文件上传示例
HTML的代码:(关键是要在form里设置enctype="multipart/form-data",这样才能在提交表单时,将文件以二进制流的形式传输到服务器) 一. <fo ...
- html5的FormData对象和input的file属性以及window.URL.createObjectURL( ) 方法(转载)
/** FormData ==>表单数据 能自动把表单数据拼接打包 当ajax发送数据时,发送打包的数据; 还可以使用FormData对象的append(key,value)添加数据 FormD ...
- input type='file'上传控件假样式
采用bootstrap框架样式 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> &l ...
- <input type="file">上传文件并添加路径到数据库
注:这里是用的mvc所以没法用控件 html代码 <form method="post" enctype="multipart/form-data"> ...
- 【原创】js中input type=file的一些问题
1.介绍 在开发中,文件上传必不可少,input[type=file] 是常用的上传标签,但是它长得又丑.浏览的字样不能换,但是他长得到底有多丑呢.我们来看看在不同浏览器里的样子吧. <inpu ...
- input的file 控件及美化
在一些网站进行上传时,当单击了“浏览”按钮之后会弹出[选择文件]的对话框.想要实现这一功能,用input的file控件来实现就好啦~ <!doctype html> <html la ...
- FormData、Blob、File、ArrayBuffer数据类型
XMLHttpRequest 1.0 1.0 中xmlhttpRequest有2个重要的返回属性,reposeText,reposeXml.下面的数据类型都是2.0新增的 FormData对象 我们应 ...
- 关于PHP HTML <input type="file" name="img"/>上传图片,图片大小,宽高,后缀名。
在我们的系统中,不免要上传图片,视频等文件,在上传中,需要做的一些判断,文件大小等方面. 注意: 在php.ini 中的post_max_size,upload_max_filesize默认为2M,在 ...
- 自定义上传按钮 <input type="file" name = "file"/> (将file隐藏在button下)
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...
随机推荐
- 为webService添加Interceptor(拦截器)
今天写一个简单的拦截器,以webService接口为例: 背景:H5的一个项目,只要调用H5webService 接口下面的方法都会触发一个AuthorityInterceptor去验证是否调用类型是 ...
- 条件运算符在GUN C中的特殊用法.
在阅读内核源码的时候,发现了条件表达式的奇怪用法,一时没有反应过来.下面的内容是从wiki转载而来,用作回顾和备忘. 转载链接:https://zh.wikipedia.org/wiki/%E6%9D ...
- python 序列 转换 各种操作
# 数据结构 字符串 列表 元组 数字序列# 10-19的整数# r1 = range(10,20)# print(r1)# print(type(r1))## # 19# print(r1[9])# ...
- 2018-2019 ICPC, NEERC, Southern Subregional Contest (codeforces 1070)
A. 直接从状态(0,0)bfs, 这样一定是最小的 #include <iostream> #include <sstream> #include <algorithm ...
- TCPcopy环境搭建
参考文档:https://github.com/session-replay-tools/tcpcopy 辅助机器Assistant Server: 1.下载最新版本 git clone git:// ...
- vue项目报错1 Vue is a constructor and should be called with the `new` keyword && jquery.js?eedf:3850 Uncaught TypeError: this._init is not a function...
Vue is a constructor and should be called with the `new` keyword Uncaught TypeError: this._init is n ...
- Python3 A*寻路算法实现
# -*- coding: utf-8 -*- import math import random import copy import time import sys import tkinter ...
- 在window环境下安装symfony2框架注意事项
首先先放上放上安装的教程:http://www.symfonychina.com/doc/current/setup.html 然后说一下笔者遇到的坑 在运行这条命令的时候,虽然成功下载读取下来了,但 ...
- mysql个人初配置
记录下在ubuntu 18.04.3 LTS环境中安装mysql和个人初期简单设置. 1:安装myslq:sudo apt install mysql-server. 2:设置root密码.由于我没有 ...
- 遍历获取html页面所有元素的id
因为要写一个权限管理系统精确到每个标签.以前用过的是给每个标签加权限判断的代码.但感觉这种方式太麻烦和落后,向让页面加载时自动把每个标签的id扫描到并保存到数据库.通过id控制.研究了下实现代码如下: ...