代码:

// 获取文件流
var fileObj = document.getElementById('inputId').files;
// 实例化一个FileReader对象
var reader = new FileReader();
// 创建一个img
var img = $('<img />');
reader.onload = function (e) {
img.attr('src', e.target.result);
$('#selector').append(img);
}
// base64转码
reader.readAsDataURL(fileObj);

JS图片上传后base64转码的更多相关文章

  1. js实现图片上传后即时预览

    //关于FileReader对象 http://blog.csdn.net/zk437092645/article/details/8745647 <!DOCTYPE html> < ...

  2. 兼容好的JS图片上传预览代码

    转 : http://www.codefans.net/articles/1395.shtml 兼容好的JS图片上传预览代码 (谷歌,IE11) <html xmlns="http:/ ...

  3. 分离与继承的思想实现图片上传后的预览功能:ImageUploadView

    本文要介绍的是网页中常见的图片上传后直接在页面生成小图预览的实现思路,考虑到该功能有一定的适用性,于是把相关的逻辑封装成了一个ImageUploadView组件,实际使用效果可查看下一段的git效果图 ...

  4. js图片上传 的方法

    先规划出框架 <div id="AQA" style="width:300px; height:200px; background-color:aquamarine ...

  5. 前端js图片上传

    前端js图片上传,原理用input type="file"获取图片然后把图片转换成base64编码传到后台. 图片上传 <!DOCTYPE html><html& ...

  6. 改变wordpress图片上传后的压缩质量

    WordPress 在图片上传后会默认压缩图片质量为原来的 90%,这样做的好处可以极大的加快页面的载入速度与缩小图片大小所占服务器空间. 如果希望 100% 原质量怎么办呢?如何禁止 WordPre ...

  7. django实现图片上传后自动修改尺寸并保存修改后的图到数据库和本地文件系统

    图片上传首先要是设置settings.py文件(与静态文件设置类似) MEDIA_ROOT = os.path.join(BASE_DIR,'media')MEDIA_URL = '/media/' ...

  8. 使用百度UMeditor富文本编辑器,修改自定义图片上传,修改源码

    富文本编辑器,不多说了,这个大家应该都用到过,至于用到的什么版本,那就分很多种 CKEditor:很早以前叫FCK,那个时候也用过,现在改名了,比较流行的一个插件,国外很多公司在用 UEDITOR:百 ...

  9. JS图片上传预览插件制作(兼容到IE6)

    其实,图片预览功能非常地常见.很意外,之前遇到上传图片的时候都不需要预览,也一直没有去实现过.现在手上的项目又需要有图片预览功能,所以就动手做了一个小插件.在此分享一下思路. 一.实现图片预览的一些方 ...

随机推荐

  1. BZOJ 1617: [Usaco2008 Mar]River Crossing渡河问题( dp )

    dp[ i ] = max( dp[ j ] + sum( M_1 ~ M_( i - j ) ) + M , sum( M_1 ~ M_i ) ) ( 1 <= j < i )  表示运 ...

  2. Node.js学习笔记2(安装和配置Node.js)

            1.安装         windows下安装,在http://nodejs.org下载安装包进行安装即可.         linux下安装,使用yum或者下载源码进行编译.     ...

  3. Nginx阅读笔记(二)之location的用法

    两个配置文件 一: server { listen 80; # # 在本机所有ip上监听80,也可以写为192.168.1.202:80,这样的话,就只监听192.168.1.202上的80口 ser ...

  4. C++堆和栈的比较(7个区别)

    基础知识: 堆 栈是一种简单的数据结构,是一种只允许在其一端进行插入或删除的线性表.允许插入或删除操作的一端称为栈顶,另一端称为栈底,对堆栈的插入和删除操作被称 为入栈和出栈.有一组CPU指令可以实现 ...

  5. myeclipse部署时An internal error occurred 错误的几种情况

    myecplise上将工程部署到应用下时,经常出现 An internal error occurred during: "Add Deployment". java.lang.N ...

  6. Logback相关知识汇总

    例如:%-4relative 表示,将输出从程序启动到创建日志记录的时间 进行左对齐 且最小宽度为4格式修饰符,与转换符共同使用:可选的格式修饰符位于“%”和转换符之间.第一个可选修饰符是左对齐 标志 ...

  7. 在MDK中怎样生成*.bin格式的文件?

    在Realview MDK的集成开发环境中.默认情况下能够生成*.axf格式的调试文件和*.hex格式的可运行文件. 尽管这两个格式的文件很有利于ULINK2仿真器的下载和调试,可是ADS的用户更习惯 ...

  8. ThinkPHP - 自定义扩展类库

    首先在想要使用类库的地方建立文件夹,文件名称随意,不能使用class 然后在配置文件中: 'AUTOLOAD_NAMESPACE' => array( 'Lib' => './Lib', ...

  9. linux嵌入式: 实现自己的tree命令

    //# cat treecmd.c #include<stdio.h> #include<dirent.h> #include<sys/stat.h> #inclu ...

  10. goahead cgi 及出现的问题解决

    1. route.txt    配置cgi路径 route uri=/cgi-bin dir=/web handler=cgi 2.交叉编译生成cgi goahead  源码路径下  ./test/c ...