formData上传图片
---------------------formData上传图片---------------------
<form id="imageform">
<img src="img/user_logo_center.png" class="user_logo"/>
<i class="change_pho"></i>
<input type="file" name="photo" accept="image/png,image/gif,image/jpg,image/jpeg" id="change_pho_btn">
<form>
$("#change_pho_btn").on("change",function(){
var formData = new FormData($( "#imageform" )[0]);
formData.append("type", "avatar");
$.ajax({
url: '',
type: 'POST',
data: formData,
async: false,
cache: false,
contentType: false,
processData: false,
success: function (data) {
$('#imageform .user_logo').attr('src',data.img_url);
},
error:function(){
}
});
})
----------------------获取客户端图片链接--------------------------------
---》必须为文件对象或者BLOB对象(2进制对象)
var img_url=window.URL.createObjectURL($("#upload_pic").get(0).files[0])
$("img").attr("src",img_url)
formData上传图片的更多相关文章
- 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> 网页会显示一个这 ...
随机推荐
- 控制台手动编译Qt5程序
转自:http://www.cnblogs.com/csulennon/p/4479236.html 在上一篇随笔中已经搭建好了Qt5的的开发环境,并且通过Qt Creator自动构建了一个视窗程序. ...
- elasticsearch,python包pyes进行的处理
elasticsearch:高性能搜索引擎,官网:https://www.elastic.co/products/elasticsearch/ 对于它相信大家都不陌生,es的使用已经广泛存在 各大网站 ...
- PKU 1007
题名:DNA排序 题意:给定字符串长度.个数,计算每个字符串的逆序数,然后从大到小排列,有兴趣的可以去看下原题. 计算字符串逆序数,然后排序,这里使用了快速排序算法,string释放的时候竟然有问题, ...
- BZOJ 3176 Sort
先一遍reverse+逆序对个数. 要开long long啊. #include<iostream> #include<cstdio> #include<cstring& ...
- -webkit-appearance、sselect
-webkit-appearance 是一个 不规范的属性(unsupported WebKit property),用来改变按钮和其他控件的外观,使其外观类似于原生控件. iOS下的safari中有 ...
- 字符编码详解及由来(UNICODE,UTF-8,GBK)[转帖]
相信許多人對字符編碼都不是很了解,透過下文可以清晰的理解各种字符编码方式详解及由来. 一直对字符的各种编码方式懵懵懂懂,什么ANSI.UNICODE.UTF-8.GB2312.GBK.DBCS.UCS ...
- jQuery学习总结
1:jQuery是什么 jQuery是继prototype之后又一个优秀的Javascript框架.它是轻量级的js库,兼容各种浏览器(IE 6.0+, FF 1.5+, Safari 2.0+, O ...
- Day23_IO第五天
1.递归求5的阶乘 package com.heima.chario; public class Demo8_Digui { /** * @param args * 递归:方法自己调用自己 * 5! ...
- javaEE-----org.springframework.dao.InvalidDataAccessApiUsageException: Write operation
org.springframework.dao.InvalidDataAccessApiUsageException: Write operations are not allowed in read ...
- linux grep
grep (缩写来自Globally search a Regular Expression and Print) 是一种强大的文本搜 索工具,它能使用正则表达式搜索文本,并把匹配的行打印出来.Uni ...