不想用canvas转

  <input type="file" id="file" accept="image/*" onchange="changeImg()"/>
<script> function blobToDataURL(blob,cb) {
let reader = new FileReader();
reader.onload = function (evt) {
var base64 = evt.target.result
cb(base64)
};
reader.readAsDataURL(blob);
} var file = document.getElementById("file");
function changeImg() {
var img = file.files[0]
if(img){
var url = URL.createObjectURL(img);
var base64 = blobToDataURL(img,function(base64Url) {
console.log(base64Url)
})
}
}

input file转base64的更多相关文章

  1. JS input file 转base64 JS图片预览

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

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

    input file获取选择图片的本地路径和base64路径 本地路径: myHeadFile: function (e) { // 这里是input file 的onchange事件 ] const ...

  3. JQuery input file 上传图片

    表单元素file设置隐藏,通过其他元素打开: .imgfile为input file $(".ul").click(function () {return $(".img ...

  4. HTML中上传与读取图片或文件(input file)----在路上(25)

    input file相关知识简例 在此介绍的input file相关知识为: 上传照片及文件,其中包括单次上传.批量上传.删除照片.增加照片.读取图片.对上传的图片或文件的判断,比如限制图片的张数.限 ...

  5. Apache服务器网站访问伪静态内页出现No input file specified.的完美解决方案

    原文地址:Apache服务器网站访问伪静态内页出现No input file specified.的完美解决方案 启用REWRITE的伪静态功能的时候,首页可以访问,而访问内页的时候,就提示:&quo ...

  6. 编译安装mmseg提示cannot find input file: src/Makefile.in错误

    今天安装中文词检索功能模块 coreseek,其中一个分词模块 mmseg ,编译安装到最后,出现annot find input file: src/Makefile.in aclocal   // ...

  7. HTML5的 input:file上传类型控制

    一.input:file属性 属性值有以下几个比较常用: accept:表示可以选择的文件MIME类型,多个MIME类型用英文逗号分开,常用的MIME类型见下表. multiple:是否可以选择多个文 ...

  8. input file控件限制上传文件类型

    网页上添加一个input file HTML控件: <input id="File1" type="file" /> 默认是这样的,所有文件类型都会 ...

  9. 完美解决 nginx No input file specified.

    一次开发中遇到了这个问题:No input file specified nginx版本1.8 找遍网络都是说 fastcgi_param SCRIPT_FILENAME $document_root ...

随机推荐

  1. CentOS下Java的安装与环境配置

    网上的文章很多,但我还是不知道下次需要看谁的,或是给朋友推荐谁的,索性我都整理出来,方便下次需要的时候能很快的看到或是给朋友链接.两种安装方式:解压安装和包安装 1.安装前检查:        因为安 ...

  2. python2.7.13标准库文件目录操作与文件操作

    标准库的中文参考文档: http://python.usyiyi.cn/translate/python_278/library/index.html 官方标准库文档:https://docs.pyt ...

  3. 用于拆解和组合PDF中各个对象的shell脚本

    拆解脚本 header_start=0 header_len=15 xref_start=$(strings -a -t d $1 | grep -e "\bxref\b" | a ...

  4. 三种JavaScript 消息框

    prompt 提示框 <html><head><script type="text/javascript">function disp_prom ...

  5. java中Comparator比较器顺序问题,源码分析

    提示: 分析过程是个人的一些理解,如有不对的地方,还请大家见谅,指出错误,共同学习. 源码分析过程中由于我写的注释比较啰嗦.比较多,导致文中源代码不清晰,还请一遍参照源代码,一遍参照本文进行阅读. 原 ...

  6. java虚拟机规范(se8)——java虚拟机的编译(四)

    3.12 抛出和处理异常 在程序中使用throw关键字来抛出异常.编译结果很简单. void cantBeZero(int i) throws TestExc { if (i == 0) { thro ...

  7. 新手学习 React 迷惑的点

    网上各种言论说 React 上手比 Vue 难,可能难就难不能深刻理解 JSX,或者对 ES6 的一些特性理解得不够深刻,导致觉得有些点难以理解,然后说 React 比较难上手,还反人类啥的,所以我打 ...

  8. js转换成数字

    /** * 转换成数字,有两种方法: * 1.Number(var) * 2.parseInt(var)与parseFloat(var) */ // 字符串转换成数字 // 纯字母 var foo = ...

  9. 命令分析nginx访问日志的用法

    awk分析日志常用高级使用命令方法 分析访问日志(Nginx为例) 日志格式: '$remote_addr - $remote_user [$time_local] "$request&qu ...

  10. linux文件管理--压缩打包

    目录 linux文件管理--压缩打包 1.压缩打包介绍 2.gzip压缩工具 3.zip压缩工具 注意: 4.tar压缩工具 5.tar生产案例实践 linux文件管理--压缩打包 1.压缩打包介绍 ...