atitit.javascript js 上传文件的本地预览

1. .URL.createObjectURL 
1

1.1. 吊销所有使用 URL.createObjectURL 而创建的 URL,以避免内存泄漏
1

1.2. aticode
2

1.3. code--
2

1. .URL.createObjectURL

URL.createObjectURL()方法会根据传入的参数创建一个指向该参数对象的URL. 这个URL的生命仅存在于它被创建的这个文档里. 新的对象URL指向执行的File对象或者是Blob对象.

作者:: 老哇的爪子 Attilax 艾龙,  EMAIL:1466519819@qq.com

转载请注明来源: http://blog.csdn.net/attilax

1.1. 吊销所有使用 URL.createObjectURL 而创建的 URL,以避免内存泄漏

为 audiovideo 或 img 元素加载媒体的一种常见方式是使用 URL.createObjectURL 方法创建一个它可以使用的 URL。如果你使用此方法,那么此方法会告诉系统保留一个到你的媒体(该媒体可能是 BlobFile 或 StorageFile)的内部引用。系统将使用此内部引用来使对象流到适当的元素。但系统不知道何时需要该数据,因此,在你告诉它释放之前,它会一直保留该内部引用。

1.2. aticode

proj.wechat act

getObjectURL("fileControlId)

1.3. code--

var objUrl = getObjectURL(document.getElementById("filex").files[0]) ;

console.log(v);

console.log("objurl:"+objUrl);

$("#imgx").css("width","100%").css("height","100%").attr("src",objUrl);

}

//建立一個可存取到該file的url

function getObjectURL(file) {

var url = null ;

if (window.createObjectURL!=undefined) { // basic

url = window.createObjectURL(file) ;

} else if (window.URL!=undefined) { // mozilla(firefox)

url = window.URL.createObjectURL(file) ;

} else if (window.webkitURL!=undefined) { // webkit or chrome

url = window.webkitURL.createObjectURL(file) ;

}

return url ;

}

firefox下面显示

"objurl:blob:null/ca7a9752-68a1-4f88-9b4f-19bfbc9ca0af"



atitit.javascript js 上传文件的本地预览的更多相关文章

  1. js基础进阶--图片上传时实现本地预览功能的原理

    欢迎访问我的个人博客:http://www.xiaolongwu.cn 前言 最近在项目上加一个图片裁剪上传的功能,用的是cropper插件,注意到选择本地图片后就会有预览效果,这里整理一下这种预览效 ...

  2. JavaScript图片上传前的图片预览功能

    JS代码: //js本地图片预览,兼容ie[6-9].火狐.Chrome17+.Opera11+.Maxthon3 function PreviewImage(fileObj, imgPreviewI ...

  3. C# 结合html5 批量上传文件和图片预览

    html5 新特性 <input id="imgsf" type="file" name="imgsf" multiple /> ...

  4. 【django】ajax,上传文件,图片预览

    1.ajax 概述: AJAX = 异步 JavaScript 和 XML. AJAX 是一种用于创建快速动态网页的技术. 通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新.这意味 ...

  5. Webform之FileUpload(上传按钮控件)简单介绍及下载、上传文件时图片预览

    1.FileUpload上传控件:(原文:http://www.cnblogs.com/hide0511/archive/2006/09/24/513201.html) FileUpload 控件显示 ...

  6. js之上传文件多图片预览

    多图片上传预览功能也是现在非常常用的 下面是html代码: <html xmlns="http://www.w3.org/1999/xhtml"> <head&g ...

  7. egg.js上传文件到本地

    'use strict'; const Service = require('egg').Service; const fs = require('fs'); const path = require ...

  8. JavaScript实现本地图片上传前进行裁剪预览

    本项目支持IE8+,测试环境IE8,IE9,IE10,IE11,Chrome,FireFox测试通过 另:本项目并不支持Vue,React等,也不建议,引入JQuery和Vue.React本身提倡的开 ...

  9. js 上传文件后缀名的判断 var flag=false;应用

    js 上传文件后缀名的判断  var flag=false;应用 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional// ...

随机推荐

  1. logback中打印sql语句

    To log SQL statements for particular mybatis mapper set DEBUG (TRACE to see query parameters and res ...

  2. iOS:quartz2D绘图(处理图像,绘制图像并添加水印)

    绘制图像既可以重写drawRect:方法并在该方法中绘制,也可以不用重写该方法,它有封装好的函数获取自己的图像绘制上下文,即UIGraphicsBeginImageContext(CGSize siz ...

  3. 使用ant构建报错,编码GBK的不可映射字符解决方法

    使用ant的核心就是这个build.xml.然后再在cmd中使用ant命令就行了. build.xml构建文件包含一个工程(project). 工程包含若干个目标(target). 目标可以依赖于其他 ...

  4. wireshark在windows下无法抓取localhost数据包

    在调试SSL时要抓包,通过tcpview和minisniffer等工具明明看到tcp连接已经建立并开始收发数据了,但wireshark却总是无法抓到相应的数据包. 今天早上,HQ的高工告诉我“wire ...

  5. [Algorithom] Shuffle an array

    Shuffling is a common process used with randomizing the order for a deck of cards. The key property ...

  6. 云计算之路-阿里云上:SLB故障引发的网站不能正常访问

    2013年8月22日23:50~23:58左右,由于阿里云SLB(负载均衡)故障造成网站不能正常访问,给大家带来了麻烦,望大家谅解! 8月19日我们收到阿里云的短信通知: 尊敬的阿里云用户:      ...

  7. 虚拟机VMware12.0安装centos 6.5+VMware中虚拟机网络模式区分

    之前的步骤一路next,有设置内存大小的根据机器的配置设置一下即可. 需要注意的地方, 下面是对于简化版进行设置的步骤 虚拟机网络模式 1.桥接模式 在桥接模式下,VMware虚拟机里的系统就像是 局 ...

  8. js知识梳理1:理解对象的属性特性

    1.数据属性 数据属性的4个特性: Configurable:①表示能否通过delete删除属性从而重新定义,②能否修改属性的特性,③能否把属性修改为访问器属性.对象直接量里默认值true. Enum ...

  9. 解决Windows下,运行python工程下的模块找不的到问题

    1.首先在Windows下配置环境变量 找到python安装的目录,我是装在C:\Python27,将改路径添加到环境变量中 添加成功了,你可以在任意行下面执行 python 程序 当你在执行工程的时 ...

  10. Python 二维码解码

    二维码解析 Python中关于二维码解析的现成模块有很多,比较著名的就是Zbar以及ZXing.然而很不幸的是,官方的版本都是支持到python2.x,下面是在python2.x的例子: import ...