使用FormData上传图片
document.querySelector('.file').addEventListener('change', function(e) {
//1.可以通过this拿到这个file的DOM元素
console.log(this)
//1. e 函数事件参数对象中也有这个file的DOM元素对象。使用e.target也可以直接拿到
console.log(e.target)
//对开发人员屏蔽,所以直接 必须调用这个文件的DOM对象的files属性,返回一个数组
let files = e.target.files
console.log(files)
// console.log(files.item(0))
// console.log(files[0])
// 判断一手是否有文件
if (!files.length) return
// 上传文件 创建FormData
let formData = new FormData()
// upFile就是后台接收的key
formData.append('upFile', files[0], files[0].name)
// 将formdata发送到后台即可
// 我用的 axios.post('url', formData)
})
使用FormData上传图片的更多相关文章
- formData上传图片
---------------------formData上传图片--------------------- <form id="imageform"> <img ...
- JS中使用FormData上传图片
<!DOCTYPE html> <html> <head> <meta name="viewport" content="wid ...
- formdata 上传图片+进度条
记得引入jquery //上传进度回调函数: function progressHandlingFunction(e) { if (e.lengthComput ...
- python接口自动化16-multipart/form-data上传图片
前言 在提交表单操作的时候,经常会遇到图片上传的操作,图片上传是一个单独的接口,本篇以禅道为例,介绍如何上传图片 上传接口 1.以禅道上提交bug为例,在选择图片时,点确定按钮,就是上传图片了 2.用 ...
- python接口自动化-multipart/form-data上传图片
前言 在提交表单操作的时候,经常会遇到图片上传的操作,图片上传是一个单独的接口,本篇以禅道为例,介绍如何上传图片 上传接口 1.以禅道上提交bug为例,在选择图片时,点确定按钮,就是上传图片了 2.用 ...
- httprunner学习25-文件上传multipart/form-data
前言 httprunner上传文件接口,其实跟requests上传文件的接口是一样的,之前在python接口系列里面有案例 python接口自动化16-multipart/form-data上传图片 ...
- 真正解决百度编辑器UEditor上传图片跨域问题
做前后端分离的项目用到UEditor,把上传图片程序拿出来放到了接口程序中,上传图片接口已经做了跨域处理,按理说编辑器中上传图片应该不会有问题.可是配置好图片上传路径后,运行,打开调试,测试一下,报错 ...
- PHP上传图片,路径保存在数据库中,根据图片路径显示图片
1.创建数据表 CREATE TABLE image( id int(4) unsigned NOT NULL AUTO_INCREMENT, name varchar(100) default ...
- 练习JavaScript判断上传文件后缀名
<script type = text/javascript> function jiance(filename) { var pic = ["jpg","p ...
- HTML基础篇之内嵌框架和表单
内嵌框架: <iframe src="http://www.baidu.com" name="d"></iframe> 网页会显示一个这 ...
随机推荐
- JAVA 进阶 69-79
10/20 1. 创建 媒体类型 了解父类与子类 import java.util.ArrayList; //导入包 public class sfgda { //定义容器 容器类型是DGSD这个类型 ...
- 自动化测试方案对比:Katalon vs Python
公司要用katalon做自动化,我提议用更加主流的python的方案,即pytest+selenium.下面是做一个大概的对比,以引导团队尽可能的选择可靠的方案. 接下来我直接把我当时讲的ppt贴上来 ...
- 分析总结一下所有有关打印题目的套路和思路:pat乙级:1109 擅长C, 1008元素循环右移,1050 螺旋矩阵,1027 打印沙漏等等
分析: 首先你要明白第一件事:所有要打印东西的题目打印都是从第一行到最后一行,从第一列到最后一列,你是没办法跳着打印的.可以看看其他几个打印题目1008元素循环右移,1050 螺旋矩阵1027 打印沙 ...
- LeetCode-398 随机数索引
来源:力扣(LeetCode)链接:https://leetcode-cn.com/problems/random-pick-index 题目描述 给定一个可能含有重复元素的整数数组,要求随机输出给定 ...
- Hive数仓基础
架构图: 组成:SQL语句到任务执行需要经过解释器,编译器,优化器,执行器 解释器:调用语法解释器和语义分析器将SQL语句转换成对应的可执行的java代码或业务代码 编译器:将对应的java代码转 ...
- Vue props配置项(属性)
功能:让组件接收外部传过来的数据 1.传递数据: <Demo name="XXX"/> 2.接收数据: (1)第一种方式(只接收): props:['name'] (2 ...
- ucloud 签名算法
# Python version:3.6.5 import hashlib import urllib from urllib.parse import urlparse params = { &qu ...
- Kmeans中文聚类
中文文本kmeans聚类原理:K就是将原始数据分为K类,Means即均值点.K-Means的核心就是将一堆数据聚集为K个簇,每个簇中都有一个中心点称为均值点,簇中所有点到该簇的均值点的距离都较到其他簇 ...
- virtualenv指定使用本地某个版本python
virtualenv -p D:\env\py37_1\Scripts\python3.exe time01 红色的地方是 你本地python解释器的安装路径,后面黄色部分是创建的虚拟环境的名称. 另 ...
- js中常用Math对象
js中常用Math对象 Math.round()四舍五入 Math.ceil() ->ceil 天花板--->向上取整 Math.floor() 向下取整 Math.floor(-11.1 ...