input file获取选择图片的本地路径和base64路径

本地路径:

myHeadFile: function (e) {   // 这里是input  file 的onchange事件
const file = e.srcElement.files[]
const imgURL = window.URL.createObjectURL(file) // imgURL就是你的图片的本地路径,两部就能解决问题
}

base64:

//获取文件
var file = $("#imgForm").find("input")[].files[]; //创建读取文件的对象
var reader = new FileReader(); //创建文件读取相关的变量
var imgFile;
reader.onload=function(e) {
alert('文件读取完成');
imgFile = e.target.result;
console.log(imgFile);
$("#imgContent").attr('src', imgFile);
}; //正式读取文件
reader.readAsDataURL(file);

input file获取选择图片的本地路径和base64路径的更多相关文章

  1. html,图片上传预览,input file获取文件等相关操作

    input file常用方法: var obj=document.getElementById("upimage"); var file=obj.files[0];//获取文件数据 ...

  2. 将input file的选择的文件清空的两种解决方案

    <input type="file" id="fileupload" name="file" /> 上传文件时,选择了文件后想清 ...

  3. [转]将input file的选择的文件清空

    本文转自:http://hi.baidu.com/xiongshihu/item/125c79b47632e794194697f5 上传文件时,选择了文件后想清空文件路径的两种办法: JS代码 < ...

  4. Android中获取选择图片与获取拍照返回结果差异

    导语: 如今的安卓应用在选择图片的处理上大多合并使用拍照和从相册中选择这两种方式 今天在写一个这样的功能时遇到一个尴尬的问题,同样是拍照获取图片功能,在不同手机上运行的效果不一样,下面是在某型手机上测 ...

  5. curl获取远程图片存到本地

    $url = 'http://sssss/sss/xu0fLo9waqKSTDO7j0kSO41O5Luq3LB6ozUvY4O7OsXUWNicB49fBs8nGYzoqcwGDARQZHpVuic ...

  6. 简单获取input file 选中的图片,并在一个div的img里面赋值src实现预览图片

    html代码: <input id="file_upload" type="file" /> <div class="image_c ...

  7. 怎么简单获取input file 选中的图片,并在一个div的img里面赋值src实现预览?

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs ...

  8. 获取input file 选中的图片,并在一个div的img里面赋值src实现预览

    代码如下利用html5实现:几乎兼容所有主流浏览器,当然IE必须是IE 6以上 [jquery代码] $(function() { $("#file_upload").change ...

  9. 通过file文件选择图片预览功能

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. display:table和display:table-cell结合使用

    .GoodList{ display :table; height :54px; width :56px; line-height: 14px                 padding: 0 1 ...

  2. [LeetCode] 595. Big Countries_Easy tag: SQL

    There is a table World +-----------------+------------+------------+--------------+---------------+ ...

  3. 机器学习理论基础学习3.2--- Linear classification 线性分类之线性判别分析(LDA)

    在学习LDA之前,有必要将其自然语言处理领域的LDA区别开来,在自然语言处理领域, LDA是隐含狄利克雷分布(Latent Dirichlet Allocation,简称LDA),是一种处理文档的主题 ...

  4. Object之clone

    一.Object类中clone的实现. 二.clone详解. 看,clone()方法又是一个被声明为native的方法,因此,我们知道了clone()方法并不是Java的原生方法,具体的实现是有C/C ...

  5. GUN C中的attribute

    GNU C 的一大特色就是__attribute__ 机制.__attribute__ 可以设置函数属性(Function Attribute ).变量属性(Variable Attribute )和 ...

  6. mov指令

    一.规定 1.立即数不能作为目的操作数,如mov 110H,AX 2.立即数不能直接传给段寄存器,如mov DS,110H 2.两个操作数不能同时为段寄存器,如mov ES,DS 3.两个操作数不能同 ...

  7. sql可重复执行语句例子

    1.添加字段 SET @add_key_type_to_report = (SELECT IF( (SELECT count(1) FROM INFORMATION_SCHEMA.COLUMNS WH ...

  8. Atcoder Tenka1 Programmer Contest 2019 D Three Colors

    题意: 有\(n\)个石头,每个石头有权值,可以给它们染'R', 'G', 'B'三种颜色,如下定义一种染色方案为合法方案: 所有石头都染上了一种颜色 令\(R, G, B\)为染了'R', 染了'G ...

  9. 测试开发-web测试要点

    参数输入考虑 参数数值包含1个.多个.很多个.null.参数值前后包含空格的2种情况   数字类型:正数.负数.0.0.0.+0.0.-0.0.指数.对数.分数.小数.复数.科学计数法的测试,全角的数 ...

  10. Linux 安装JDK(jdk-8u121-linux-x64.tar.gz)

    Linux 安装JDK(jdk-8u121-linux-x64.tar.gz) 一.JDK准备 1.1 文件名称 jdk-8u121-linux-x64.tar.gz 1.2 下载地址 http:// ...