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> 网页会显示一个这 ...
随机推荐
- Android -- 关闭AsyncTask(异步任务)
前面说了如何操作AsyncTask,这篇我们来说一下如何关闭AsyncTask. 有人就问了:为什么要关闭AsyncTask呢?很简单,AsyncTask 是在后台执行耗时操作(获取数据),当你离开当 ...
- 涵涵和爸爸习惯养成进度表(二)(May 30 - )
规则说明 22天内,没有哭脸,不超过三个无表情脸,可以给一个奖励(动画书等) 涵涵违反规则,在爸爸和妈妈都同意的情况下,可以给无表情脸 爸爸违反规则,在妈妈和涵涵都同意的情况下,可以给无表情脸 获奖记 ...
- 第七章 LED将为我闪烁:控制发光二极管
该Linux驱动用来控制开发板上的4个LED灯,即通过向Linux驱动发送数据可以控制LED灯的开关.LED驱动提供两种交互方式:命令和读写设备文件. 测试LED驱动之前需用USB线连接开发板,然后打 ...
- 想学好web前端,需要看哪些书籍
目前市场上HTML.CSS 类别书籍,都是大同小异,在当当网.卓越网搜索一下很多推荐.今天web前端大牛根据自己的经验总结如下:Javascript 的书籍推荐看老外写的,国内很多 Javascrip ...
- AC自动机及trie图 pascal
; type data=record sum,failed:longint; son:array ['a'..'z'] of longint; end; ..maxn] of data; que:.. ...
- Python中的可迭代对象与迭代器对象
刚刚学习Python,对“可迭代对象”和"迭代器对象"的个人理解,不知道对不对. 1.几个概念 (1)迭代工具:包括for循环.列表解析.in成员关系测试.....等等在内的,用于 ...
- ThinkPHP M函数疑点
模型类的命名规则是除去表前缀的数据表名称,采用驼峰法命名,并且首字母大写,然后加上模型层的名称(默认定义是Model),例如: 模型名 约定对应数据表(假设数据库的前缀定义是 think_) User ...
- Win10/UWP新特性—SharedStorageAccessManager 共享文件
首先先给大家推荐一个UWP/Win10开发者群:53078485 里面有很多大婶,还有很多学习资源,欢迎大家来一起讨论Win10开发! 在UWP开发中,微软提供了一个新的特性叫做SharedStor ...
- [转]透过 Linux 内核看无锁编程
非阻塞型同步 (Non-blocking Synchronization) 简介 如何正确有效的保护共享数据是编写并行程序必须面临的一个难题,通常的手段就是同步.同步可分为阻塞型同步(Blocking ...
- linux和windows共享文件
开发板的文档上说可以使用nfs共享文件夹,提供的命令如下: mount –t nfs –o nolock 192.168.1.244:/usr/ /mnt/ 因此我在我的win10上设了共享文件夹,然 ...