window.url.createobjecturl 兼容多种浏览器(IE,google,360,Safari,firefox)
<script type="text/javascript">
function setImagePreview() {
var docObj = document.getElementById("ctl00_ContentMain_file_head");
var fileName = docObj.value;
if (!fileName.match(/.jpg|.gif|.png|.bmp/i)) {
alert('您上传的图片格式不对。请又一次选择!');
return false;
} var imgObjPreview = document.getElementById("preview");
if (docObj.files && docObj.files[0]) {
//火狐下,直接设img属性
imgObjPreview.style.display = 'block';
imgObjPreview.style.width = '63px';
imgObjPreview.style.height = '63px';
//imgObjPreview.src = docObj.files[0].getAsDataURL();
if (window.navigator.userAgent.indexOf("Chrome") >= 1 || window.navigator.userAgent.indexOf("Safari") >= 1) {
imgObjPreview.src = window.webkitURL.createObjectURL(docObj.files[0]);
}
else {
imgObjPreview.src = window.URL.createObjectURL(docObj.files[0]);
}
} else {
//IE下。使用滤镜
docObj.select();
docObj.blur();
var imgSrc = document.selection.createRange().text;
var localImagId = document.getElementById("localImag");
//必须设置初始大小
localImagId.style.width = "63px";
localImagId.style.height = "63px";
//图片异常的捕捉,防止用户改动后缀来伪造图片
try {
localImagId.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale)";
localImagId.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = imgSrc;
} catch (e) {
alert("您上传的图片格式不对。请又一次选择! ");
return false;
}
imgObjPreview.style.display = 'none';
document.selection.empty();
}
return true;
} </script>
<div id="localImag"><img id="preview" width="-1" height="-1" style="display:none" /></div>
<asp:FileUpload ID="file_head" runat="server" onchange="javascript:setImagePreview();" />
版权声明:本文博主原创文章,博客,未经同意不得转载。
window.url.createobjecturl 兼容多种浏览器(IE,google,360,Safari,firefox)的更多相关文章
- 浏览器 本地预览图片 window.url.createobjecturl
第一种方式 <script type="text/javascript"> function setImagePreview() { var docObj = docu ...
- html5的FormData对象和input的file属性以及window.URL.createObjectURL( ) 方法(转载)
/** FormData ==>表单数据 能自动把表单数据拼接打包 当ajax发送数据时,发送打包的数据; 还可以使用FormData对象的append(key,value)添加数据 FormD ...
- 真正的让iframe自适应高度 兼容多种浏览器随着窗口大小改变
今天有朋友问到我关于"iframe自适应高度"的问题,原本以为是很简单的问题,没想到折腾了20分钟才搞定.期间遇到几个问题,要么是高度自适应了,但是当窗口改变时会出现滚动条.也就是 ...
- filereader 和 window.URL.createObjectURL
<template> <div class="file-preview"> <h4>前端图片预览之 filereader 和 window.UR ...
- window.URL.createObjectURL
window.URL.createObjectURL https://html5.xgqfrms.xyz/Canvas/safety-canvas.html var video = document. ...
- js图片前端预览之 filereader 和 window.URL.createObjectURL
//preview img : filereader方式 document.getElementById('imgFile').onchange = var ele = document.getEle ...
- DIV以及图片水平垂直居中兼容多种浏览器
纯css完美地解决图片以及div垂直水平居中,兼容IE7.0.IE6.0.IE5.5.IE5.0.FF.Opera.Safari具体实现css 如下,感兴趣的朋友可以参考下哈 第一种:全CSS控制 ...
- 原生JavaScript拖动div兼容多种浏览器
说句题外话,虽然博客园嵌入式氛围不行,Web前端氛围还是很好的.我又从 chinaunix 回来了. <html> <head> <script type="t ...
- iframe自适应高度(兼容多种浏览器)
http://jingyan.baidu.com/article/b87fe19eaeb2cf5218356896.html 让iframe自适应高度,下面是实现的源码: <div id=&qu ...
随机推荐
- 未能加载文件或程序集“System.Collections.Concurrent”或它的某一个依赖项。
未能加载文件或程序集“XXXXXX”或它的某一个依赖项.试图加载格式不正确的程序. 在本机WIN7机器上的WebService部署到Win2008R2上发现错误 “/”应用程序中的服务器错误. 未 ...
- POJ 3723 Conscription MST
http://poj.org/problem?id=3723 题目大意: 需要征募女兵N人,男兵M人,没征募一个人需要花费10000美元,但是如果已经征募的人中有一些关系亲密的人,那么可以少花一些钱, ...
- 辛星解读之php中的重点函数第一节之数组函数
这里我已经写好它的pdf版本号了,比本博客更加适合阅读.首先说一下它在百度网盘的下载地址把:百度网盘下载 ,假设左边连接跪了.能够在浏览器中输入:http://pan.baidu.com/s/1qW5 ...
- WCF学习笔记——WCF基础
一 WCF与SOA SOA是一种通过为所有软件提供服务外观,并将这些服务的WSDL集中发布到一个地方的一种组织企业软件的方法.它通过使用明确定义的接口通过跨越边界传递消息来让多个自治的服务协同工作.S ...
- numpy 高阶函数 —— np.histogram
np.diff(a, n=1, axis=-1):n 表示差分的阶数: >> x = np.array([1, 2, 4, 7, 0]) >> np.diff(x) array ...
- Ajax之旅(二)--XMLHttpRequest
上文中提到的Ajax的异步更新.主要使用XMLHttpRequest对象来实现的,XMLHttpRequest对象能够在不向server提交整个页面的情况下,实现局部更新网页. 当页面所有载 ...
- ZOJ 1914 Arctic Network (POJ 2349 UVA 10369) MST
ZOJhttp://acm.zju.edu.cn/onlinejudge/showProblem.do?problemCode=1914 POJhttp://poj.org/problem?id=23 ...
- ARM+linux学习过程(1)虚拟机下ubuntu上网
总结:(1)通过bridge方式也可以实现ubuntu上网(只要PC物理网卡能上网),可以实现ping通主机和开发板 (2)要想上网简单上网,可以通过nat方式,在vmware中设置为nat方式,选择 ...
- 【u125】最大子树和
Time Limit: 1 second Memory Limit: 128 MB [问题描述] 小明对数学饱有兴趣,并且是个勤奋好学的学生,总是在课后留在教室向老师请教一些问题.一天他早晨骑车去上课 ...
- PatentTips - Highly-available OSPF routing protocol
BACKGROUND OF THE INVENTION FIG. 1A is a simplified block diagram schematically representing a typic ...