<input type="file" id="picFile" /> 
 function readFile() {
     var obj = document.getElementById("picFile");
     if (obj.files.length < 1) {
         console.log("请选择文件");
         return;
     }
     var file = obj.files[0];
     if (!/image\/\w+/.test(file.type)) {
         console.log("请确保文件为图像类型");
         return;
     }
     var reader = new FileReader();
     reader.readAsDataURL(file);
     reader.onload = function (e) {
         //console.log(e.target.result);
         console.log(this.result);
     }
 }

FileReader获取文件的base64编码的更多相关文章

  1. Java,获取文件的Base64字符串,解码Base64字符串还原文件

    在jdk1.8以前,获取文件Base64字符串需要用到第三方库,从1.8开始,Java中引入了Base64相关的类 以下是代码示例 获取文件的Base64编码字符串 import java.io.Fi ...

  2. JS 获取图片的base64编码

    获取图片的base64编码 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> ...

  3. JS上传图片-通过FileReader获取图片的base64

    下面文章,我想要的是: FileReader这个对象,可以借助FileReader来获取上传图片的base64,就可以在客户端显示该图片了.同时,还可以把该图片的base64发送到服务端,保存起来. ...

  4. 如何获取图片的base64编码

    1.准备一张图片,比如1.gif 2.使用chrome浏览器,新建立一个窗口,然后将a.png拖动至浏览器窗口里面,打开控制台(检查),最后点击source 3.使用方法: 注意source获取的一串 ...

  5. HTML5 通过文件输入框读取文件为base64文件, 并借助canvas压缩 FileReader, files, drawImage

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  6. 媒体文件audio 转 base64 编码 (利用 FileReader & Audio 对象)

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  7. 获取图片base64编码的几种方法

    前文中我们聊了 Data URI 和 base64编码,稍微回顾下.base64编码 是将数据用 64 个可打印的字符进行编码的方式,任何数据底层实现都是二进制,所以都可以进行 base64编码,ba ...

  8. 图片转换base64编码,点击div的时候选择文件

    有时候我们希望文件上传的时候预览图片,下面插件可以实现上传前预览图片 (也可以提取文件的base64编码) max-height: 140px;max-width: 120px;可以指定图片的最大宽度 ...

  9. FileReader 获取图片BASE64 代码 并预览

    FileReader 获取图片的base64 代码 并预览 FileReader ,老实说我也不怎么熟悉.在这里只是记录使用方法. 方法名 参数 描述 abort none 中断读取 readAsBi ...

随机推荐

  1. vs2015全新nuget使用全析

    随着vs2015正式版本的发布,实在按捺不住,安装体验了一把,感触最大的除了可以调试lamda以外莫过于对nuget的升级. 先来一张全景: 怎么样,风格完全不同了吧.可以显示预发行版本了,右上角那个 ...

  2. react+redux官方实例TODO从最简单的入门(4)-- 改

    上一篇文章实现了<删>这个功能,那么我们继续添加下一功能--<改> 这个修改的功能是通过双击每个子选项实现 第一步:按规矩来,添加一个状态声明 第二步:action中约定我们要 ...

  3. matlab -xlsread 打开xls文件出错:服务器出现意外情况

    错误:xlsread:服务器出现意外情况 原因:非matlab问题,Excel的com加载项启用 解决方法:office - Excel选项-加载项:管理-com加载项-转到-取消可用加载项的勾选.

  4. [CodeWars][JS]如何判断给定的数字是否整数

    问题描述: We are asking for a function to take a positive integer value, and return a list of all positi ...

  5. win10进入安全模式的方法(F8不管用/开不开机)

    win10默认不能进入安全模式,这时候开机黑屏怎么办?下面介绍强制进入安全模式的方法 1. 关机情况下,按开机键开机,等到出现徽标(下图),这时候长按开机键强制关机. 2. 再次开机,出现徽标,再次强 ...

  6. SQL中循环和条件语句

    .if语句使用示例: declare @a int begin print @a end else begin print 'no' end .while语句使用示例: declare @i int ...

  7. eclipse开发servlet,HttpServletRequest报红叉解决方案

    eclipse开发servlet,HttpServletRequest报红叉解决方案 今天突然间有兴致,想打一会代码,于是开发一个Servlet,代码和配置路径都没问题,HttpServlet居然报错 ...

  8. [原创]MvvmLight中用IDialogService替代DialogMessage的用法

    在新版的MvvmLight中,DialogMessage被标注为已过时,需要用IDialogService来替代,IDialogService的具体用法如下: 先在主窗体中实现IDialogServi ...

  9. SQL 检查 是否存在 表 临时表

    1.检查临时表是否存在 已有临时表#temp2 if exists(select * from tempdb..sysobjects where id =object_id('tempdb..#tem ...

  10. c++中4个与类型转换相关的关键字分析

    static_cast reinterpret_cast dynamic_cast const_cast 1.**static_cast------运算符完成相关类型之间的转换** 使用场景:如在同一 ...