不想用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. Mr. Panda and Crystal(最短路+完全背包)

    http://codeforces.com/gym/101206/attachments 题意: T组输入,每组给出m,n,k,m为能量总数,n为水晶种类数,k为合成方案数.有的水晶可以用能量制造,有 ...

  2. Python 学习笔记13 类 - 创建和简单使用

    介绍: 面向对象编程是一种非常有效的软件编写方法之一,在面向对象编程中,我们会编写表示现实世界中的事物或者情景的类,并基于类来创建对象. 在编写类的的时候,这些类对象一般都有通用的行为或者属性.基于类 ...

  3. javaIO流(四)--输入与输出支持

    一.打印流 如果现在要想通过程序实现内容的输出,核心的本质一定要依靠OutputStream类来支持但是OutputStream类有一个最大的缺点,这个类的数据输出操作功能有限,所有的数据一定要转为字 ...

  4. 浮点字符串转int类型报错,解决

    一,直接上代码,先转double,再强转int,看你是选择,舍入,还是直接取整数位 var a1 = "1500.76"; var a2 = Convert.ToDouble(a1 ...

  5. Hibernate4教程二:基本配置

    可编程的配置方式一: 如果在配置cfg.xml的时候,不想在里面配置hbm.xml怎么办呢?可在程序里使用可编程的配置方式,也就是使用程序来指定在cfg.xml里面的配置信息,不推荐这种方式.如下: ...

  6. Codeforces 354B 博弈, DP,记忆化搜索

    题意:现在有一个字符矩阵,从左上角出发,每个人交替选择一个字符.如果最后字符a数目大于字符b,那么第一个人获胜,否则b获胜,否则平均.现在双方都不放水,问最后结果是什么? 思路:这题需要注意,选择的字 ...

  7. php导出xls,报错:文件格式和扩展名不匹配。该文件可能已损坏或不安全。除非你相信它的来源,否则不要打开它。

    打开文件报错如下 在文件头加上如下代码 ob_end_clean(); header('Content-Type:application/vnd.ms-excel'); header('Cache-C ...

  8. 深入了解 Flink 网络栈(二):监控、指标和处理背压

    在之前的文章中,我们从高级抽象到底层细节各个层面全面介绍了 Flink 网络栈的工作机制.作为这一系列的第二篇文章,本文将在第一篇的基础上更进一步,主要探讨如何监视与网络相关的指标,从而识别背压等因素 ...

  9. Python基础(三):简化除法判断、分析apache访问日志、扫描存活主机、利用多线程实现ssh并发访问

    一.简化除法判断 目标: 编写mydiv.py脚本,主要要求如下: 提示用户输入一个数字作为除数 如果用户按下Ctrl+C或Ctrl+D则退出程序 如果用户输入非数字字符,提示用户应该输入数字 如果用 ...

  10. 《NULL-2019团队》第一次作业:OUC二手交易平台

    前言 项目名称:OUC二手交易平台 项目简介:针对在校大学生的二手交易平台,相对于现在市面已有的二手APP,将其使用的普遍性范围缩小,针对在校大学生,这样可以有效的保证交易的真实性和公平性.   NA ...