---------------------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上传图片的更多相关文章

  1. JS中使用FormData上传图片

    <!DOCTYPE html> <html> <head> <meta name="viewport" content="wid ...

  2. formdata 上传图片+进度条

    记得引入jquery //上传进度回调函数:          function progressHandlingFunction(e) {            if (e.lengthComput ...

  3. python接口自动化16-multipart/form-data上传图片

    前言 在提交表单操作的时候,经常会遇到图片上传的操作,图片上传是一个单独的接口,本篇以禅道为例,介绍如何上传图片 上传接口 1.以禅道上提交bug为例,在选择图片时,点确定按钮,就是上传图片了 2.用 ...

  4. python接口自动化-multipart/form-data上传图片

    前言 在提交表单操作的时候,经常会遇到图片上传的操作,图片上传是一个单独的接口,本篇以禅道为例,介绍如何上传图片 上传接口 1.以禅道上提交bug为例,在选择图片时,点确定按钮,就是上传图片了 2.用 ...

  5. httprunner学习25-文件上传multipart/form-data

    前言 httprunner上传文件接口,其实跟requests上传文件的接口是一样的,之前在python接口系列里面有案例 python接口自动化16-multipart/form-data上传图片 ...

  6. 真正解决百度编辑器UEditor上传图片跨域问题

    做前后端分离的项目用到UEditor,把上传图片程序拿出来放到了接口程序中,上传图片接口已经做了跨域处理,按理说编辑器中上传图片应该不会有问题.可是配置好图片上传路径后,运行,打开调试,测试一下,报错 ...

  7. PHP上传图片,路径保存在数据库中,根据图片路径显示图片

    1.创建数据表   CREATE TABLE image( id int(4) unsigned NOT NULL AUTO_INCREMENT, name varchar(100) default ...

  8. 练习JavaScript判断上传文件后缀名

    <script type = text/javascript> function jiance(filename) { var pic = ["jpg","p ...

  9. HTML基础篇之内嵌框架和表单

    内嵌框架: <iframe src="http://www.baidu.com" name="d"></iframe> 网页会显示一个这 ...

随机推荐

  1. Javascript常用方法函数收集(二)

    Javascript常用方法函数收集(二) 31.判断是否Touch屏幕 function isTouchScreen(){ return (('ontouchstart' in window) || ...

  2. HTTP2试用小记

    原文:https://www.clarencep.com/2016/11/17/upgrade-nginx-to-support-http2/ 这两天把公司的网站升级到了全站https. 顺便瞄到了H ...

  3. url路由、模板语言、ajax、用django框架创建表

    1.后台管理的左侧菜单,默认只有第一个页签下面的选项是显示的,点了别的页签再显示别的页签下面的选项,问题是:点了任何菜单的选项后,左侧菜单又成了第一个页签的选项显示,别的页签隐藏,也就是左侧的菜单刷新 ...

  4. GridView导出excel格式问题

    在导出的点击事件中,代码如下: //指定导出对应单元格为文本样式 string style = @"<style> .test { vnd.ms-excel.numberform ...

  5. JSONObject

    JAR包简介: commons-lang.jar commons-beanutils.jar commons-collections.jar commons-logging.jar ezmorph.j ...

  6. css添加样式的四种方式

    1. 导入样式:在 .css文件中使用@import url("...")来引入另一个css样式表 2. 外部样式:在html页面中的head中使用 link 标签引入,如< ...

  7. com.sun.org.apache.xerces.internal.impl.io.MalformedByteSequenceException: Invalid byte 2 of 2-byte UTF-8 sequence报错解决方法

    添加了XML实体和表映射文件后,莫名报错,百思不得其解,也找不到哪里错了,后来把mybatis-config.xml文件中去掉中文注释就好了 mybatis-config.xml文件中的内容如下,去掉 ...

  8. spring简单介绍

    1.spring 的核心技术 IOC(控制翻转)和aop(切面编程) IOC容器是一种设计模式,可以说是工厂模式的升华.它有多种实现方法,其中主要是依赖注入. aop是一种设计思想,通常的功能包括日志 ...

  9. js高级编程中命名空间的两种用法

    第一种:// 声明一个全局对象Namespace,用来注册命名空间Namespace = new Object();// 全局对象仅仅存在register函数,参数为名称空间全路径,如"Gr ...

  10. PowerDesigner生成Oracle数据库时,表名会带引号问题

    使用PowerDesigner生成数据库建表SQL脚本时,尤其是Oracle数据库时,表名一般会带引号.其实加引号是PL/SQL的规范,数据库会严格按照""中的名称建表,如果没有& ...