atitit.javascript js 上传文件的本地预览
atitit.javascript js 上传文件的本地预览
1.1. 吊销所有使用 URL.createObjectURL 而创建的 URL,以避免内存泄漏
1
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,以避免内存泄漏
为 audio、video 或 img 元素加载媒体的一种常见方式是使用 URL.createObjectURL 方法创建一个它可以使用的 URL。如果你使用此方法,那么此方法会告诉系统保留一个到你的媒体(该媒体可能是 Blob、File 或 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 上传文件的本地预览的更多相关文章
- js基础进阶--图片上传时实现本地预览功能的原理
欢迎访问我的个人博客:http://www.xiaolongwu.cn 前言 最近在项目上加一个图片裁剪上传的功能,用的是cropper插件,注意到选择本地图片后就会有预览效果,这里整理一下这种预览效 ...
- JavaScript图片上传前的图片预览功能
JS代码: //js本地图片预览,兼容ie[6-9].火狐.Chrome17+.Opera11+.Maxthon3 function PreviewImage(fileObj, imgPreviewI ...
- C# 结合html5 批量上传文件和图片预览
html5 新特性 <input id="imgsf" type="file" name="imgsf" multiple /> ...
- 【django】ajax,上传文件,图片预览
1.ajax 概述: AJAX = 异步 JavaScript 和 XML. AJAX 是一种用于创建快速动态网页的技术. 通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新.这意味 ...
- Webform之FileUpload(上传按钮控件)简单介绍及下载、上传文件时图片预览
1.FileUpload上传控件:(原文:http://www.cnblogs.com/hide0511/archive/2006/09/24/513201.html) FileUpload 控件显示 ...
- js之上传文件多图片预览
多图片上传预览功能也是现在非常常用的 下面是html代码: <html xmlns="http://www.w3.org/1999/xhtml"> <head&g ...
- egg.js上传文件到本地
'use strict'; const Service = require('egg').Service; const fs = require('fs'); const path = require ...
- JavaScript实现本地图片上传前进行裁剪预览
本项目支持IE8+,测试环境IE8,IE9,IE10,IE11,Chrome,FireFox测试通过 另:本项目并不支持Vue,React等,也不建议,引入JQuery和Vue.React本身提倡的开 ...
- js 上传文件后缀名的判断 var flag=false;应用
js 上传文件后缀名的判断 var flag=false;应用 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional// ...
随机推荐
- SAP MM 模块常用的数据表
SAP MM模块常用数据表: Table Table Class Application Class Data Class Description EBAN TRANSP ME Transactio ...
- 汇编语言---GCC内联汇编
转:http://www.cnblogs.com/taek/archive/2012/02/05/2338838.html GCC支持在C/C++代码中嵌入汇编代码,这些代码被称作是"GCC ...
- ActionError,ActionMessage推荐
尽管Struts框架供给了管用的失常处理机制,但不能保证处理所有的讹谬,这时Struts框架会把讹谬抛给Web容器,在默认情形下Web容器会向用户博览器直接归来原始消息.万一想避免直接让用户看到这些原 ...
- flask上传图片或者文件
在flask unittest自动化测试中如何上传图片或者文件 import StringIO picture = StringIO.StringIO(open('/home/admin/Pictur ...
- [Python爬虫] 之十二:Selenium +phantomjs抓取中的url编码问题
最近在抓取活动树网站 (http://www.huodongshu.com/html/find.html) 上数据时发现,在用搜索框输入中文后,点击搜索,phantomjs抓取数据怎么也抓取不到,但是 ...
- ci框架(一)
ci目录结构 |-----syst ...
- 记一次vue2项目部署nginx静态文件404解决过程
github上下的一个vue2的项目,运行可以的,webpack打包后,nginx请求报错: 发现路径很奇怪啊,所以果断来到build.js文件中看看是不是哪里不对. 已经一番引用查找: 发现在这里配 ...
- minic 符号表
#include <stdio.h> #include <string.h> #include <malloc.h> typedef struct _array_d ...
- 云计算之路-试用Azure:如何建立虚拟机之间的内网连接
在阿里云上,同一个帐户创建的所有虚拟机(云服务器)之间的内网是直接连通的.而Azure则完全不一样,一开始使用时有点不知所措,后来摸索出来了——在Azure中只有处于同一个虚拟网络(Virtual N ...
- golang 聊天室
近期看了一些关于golang的资料.发现它的WEBSOCKT实现真起来真的非常easy.以下是代码 go.net/websocket是须要安装的,这个自己装上即可 package main impor ...