HTML代码:
<div id="forAppend" class="demo"></div>
JS代码:
var eleAppend = document.getElementById("forAppend");
window.URL = window.URL || window.webkitURL;
if (typeof history.pushState == "function") {
var xhr = new XMLHttpRequest();
xhr.open("get", "/image/study/s/s256/mm1.jpg", true);
xhr.responseType = "blob";
xhr.onload = function() {
if (this.status == 200) {
var blob = this.response;
var img = document.createElement("img");
img.onload = function(e) {
window.URL.revokeObjectURL(img.src); // 清除释放
};
img.src = window.URL.createObjectURL(blob);
eleAppend.appendChild(img);
}
}
xhr.send();
} else {
eleAppend.innerHTML = '<p style="color:#cd0000;">浏览器不给力,还是早点回去给孩子喂奶吧~</p>';
}

from:http://www.zhangxinxu.com/study/201310/blob-get-image-show.html

【转】通过blob获取图像并显示的更多相关文章

  1. JSP读取Oracle数据库里的图片Blob字段并显示在页面上

    1.java代码: /** * 打印模板获取电子签名 * @param request * @param resp * @param id * @return * @throws Exception ...

  2. solr4.0.0学习(二) 数据库导入clob与blob为索引

    导入clob很简单.但是blob好像没有提供方法,所以改了一下源码,重新编译替换class文件,竟然成功了. 先把配置文件贴上 SCHEMA.XML <?xml version="1. ...

  3. jsp页面file标签上传图片以及blob类型数据库存取。

    我的jsp页面表单如下: <form name="form1" action="/YiQu/AddUserServlet?jurisdiction=1" ...

  4. 聊聊JS的二进制家族:Blob、ArrayBuffer和Buffer

    事实上,前端很少涉及对二进制数据的处理,但即便如此,我们偶尔总能在角落里看见它们的身影. 今天我们就来聊一聊前端的二进制家族:Blob.ArrayBuffer和Buffer 概述 Blob: 前端的一 ...

  5. 论文第5章:Android绘图平台的实现

    面向移动设备的矢量绘图平台设计与实现 Design and Implementation of Mobile Device-oriented Vector Drawing Platform 引用本论文 ...

  6. 总结PowerShell的常用命令

    命令1: #连接Azure订阅账户 Add-AzureAccount #获取所有在连接着的Azure订阅 Get-AzureAcount Get-AzureSubscription #设置当前的Azu ...

  7. jQuery File Upload

    jQuery File Upload介绍.............................................. 2 实现基本原理......................... ...

  8. DBGrid 各属性的设置

    在 Delphi 语言的数据库编程中,DBGrid 是显示数据的主要手段之一.但是 DBGrid 缺省的外观未免显得单调和缺乏创意.其实,我们完全可以在我们的程序中通过编程来达到美化DBGrid 外观 ...

  9. 一个小时学会Git

    一.版本控制概要 Git 是一种在全球范围都广受欢迎的版本控制系统.在开发过程中,为了跟踪代码,文档,项目等信息中的变化,版本控制变得前所未有的重要.但跟踪变化远远不能满足现代软件开发行业的协同需求, ...

随机推荐

  1. Hibernate映射 --- 自身跟自身的一对多关联

      自身跟自身的一对多关联 什么时候会出现自身一对多关系呢?下面举个例子. 淘宝店里商品分类,一级分类:家用电器,个人化妆,运动户外等 家用电器下面二级分类:大家电,生活电器,厨房电器等 二级分类大家 ...

  2. 表达式树(Expression Trees)

    [翻译]表达式树(Expression Trees) 原文地址:https://docs.microsoft.com/en-us/dotnet/csharp/programming-guide/con ...

  3. SpringBoot整合SpringData JPA入门到入坟

    首先创建一个SpringBoot项目,目录结构如下: 在pom.xml中添加jpa依赖,其它所需依赖自行添加 <dependency> <groupId>org.springf ...

  4. find the most comfortable road(hdu1598)不错的并查集

    find the most comfortable road Time Limit: 1000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K ...

  5. ubuntu16.04 linux 编译安装apache2.4.33

    下载软件包: wget http://mirror.bit.edu.cn/apache//httpd/httpd-2.4.33.tar.gz wget http://mirrors.tuna.tsin ...

  6. JavaScrip 概述 -- 前端知识

    JavaScript概述 ECMAScript和JavaScript的关系 1996年11月,JavaScript的创造者--Netscape公司,决定将JavaScript提交给国际标准化组织ECM ...

  7. css3的calc()属性

    1.calc()是css3的一个新增的功能,用来指定元素的长度,你可以使用calc()给元素的border.margin.pading.font-size和width等属性动态的设置值. 2.calc ...

  8. Android工程中javax annotation Nullable找不到的替代方案

    我们在某些Android开源库中会遇到下面的引用找不到的问题:import javax.annotation.Nonnull;import javax.annotation.Nullable; 其实A ...

  9. Android热修复之 - 阿里开源的热补丁

    1.1 基本介绍 我们先去github上面了解它https://github.com/alibaba/AndFix 这里就有一个概念那就AndFix.apatch补丁用来修复方法,接下来我们看看到底是 ...

  10. git cherry-pick 用法

    1.当合并代码冲突特别多的时候,有时候只想提交自己分支的代码.这个时候使用cherry-pick 可以实现 1)首先使用 git log --oneline -n 找到最近自己分支的提交记录,n表示提 ...