<html>
<head>
<title>get file input full path</title>
<script language='javascript'>
function getFullPath(obj)
{
if(obj)
{
//ie
if (window.navigator.userAgent.indexOf("MSIE")>=1)
{
obj.select();
return document.selection.createRange().text;
}
//firefox
else if(window.navigator.userAgent.indexOf("Firefox")>=1)
{
if(obj.files)
{
return obj.files.item(0).getAsDataURL();
}
return obj.value;
}
return obj.value;
}
}
function showPic(obj){
var path=getFullPath(obj);
var picpreview=document.getElementById("preview");
if(!path){
return false;
}
if(window.navigator.userAgent.indexOf("MSIE") >= 1) {
if(picpreview) {
try{
picpreview.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = path;
}catch(ex){
return false;
}
}else{
picpreview.innerHTML="<img src='"+path+"' />";
}
} //firefox
else if(window.navigator.userAgent.indexOf("Firefox")>=1)
{
picpreview.innerHTML="<img src='"+path+"' />";
}
resizePhoto(path);
}
function resizePhoto(path){
var imgObj = new Image();
imgObj.src = path;
var width = imgObj.width;
var height = imgObj.height;
try{
if((typeof width=="undefined" || width==0) && (typeof height=="undefined" || height==0)){
var picpreview=document.getElementById("preview");
if(picpreview && picpreview.filters && picpreview.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src) {
var tempDiv=document.createElement("div");
picpreview.appendChild(tempDiv);
tempDiv.style.width="10px";
tempDiv.style.height="10px";
tempDiv.style.diplay="none";
tempDiv.style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=image);";
tempDiv.ID="previewTemp";
var url=picpreview.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src;
tempDiv.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src=url;
width=tempDiv.offsetWidth;
height=tempDiv.offsetHeight;
picpreview.removeChild(tempDiv);
picpreview.style.height=height;
picpreview.style.width=width;
}
}
}catch(e){
alert(e.name + ": " + e.message);
}
}
</script>
</head>
<body>
<input type="file" onchange="showPic(this)" />
<div id="preview"
style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale); width: 160px; height: 180px; border: solid 1px black;">
</div>
</body>
</html>
分享到：
相关推荐
Firefox3,IE6,IE7,IE8上传本地图片预览
实现了在ie8 的图片上传预览失败的功能，
jquery file上传预览本地图片支持IE6\7\8\9\10 chrome 火狐 网上有很多关于 file上传预览本地图片开源角本但都对支持到IE6\7\8，而且chrome 火狐最新版本也有问题，自己动手丰衣足食。分享给给大家。
这是一个HTML兼容本地上传图片并预览的源代码，希望大家指正。
例如ie7/ie8的滤镜预览法，firefox 3的getAsDataURL方法。 但在opera、safari和chrome还是没有办法实现本地预览，只能通过后台来支持预览。 在研究了各种预览方法后，作为总结，写了这个程序，跟大家一起分享。
JS图片预览(兼容IE6、IE7、IE8和FF)
可以在IE8下预览图片，包括绝对路径和相对路径的图片都可以。
图片预览(支持IE7)使用CSS滤镜,但是不兼容FF
IE上传图片预览,上传完一张图片，马上在页面上显示
解决了ie 7 8 火狐图片预览文件路径被过滤和文件图片原大小改变的解决方式
博主在网上找到了剥离出来的百度开发的ueditor中有多图片上传功能的例子（仅针对JSP），加上之前的适应IE8+的预览JS，二者结合，则既可以上传图片，又可以预览图片。 适应IE8+的预览JS： 下载网址为：...
兼容ie[6-9]、火狐、Chrome、opera、maxthon3、360浏览器的js本地图片预览
一个图片预览的js，兼容IE6和IE8，用的是html控件，选择图片后浏览。
用js写的图片本地上传的预览，很有用的。 不论您使用的是 IE6 还是 IE7都兼容，均可以看到以下预览。
NULL 博文链接：https://huangjiateng.iteye.com/blog/1194870
在网上找到一个高手写本地图片上传预览的插件，测试通过ie6，ff2.0、3.6，做成个Demo拿来和大家分享，jsp实现
ie6，ie7，ie8 ，和火狐上传图片预览，，非常好，，避免了用滤镜来实现，不支持跨浏览器，不用div 来实现，
利用jquery将上传的本地图片在页面显示传来，其实这个在IE下很好实现，但是本例中能够很好的兼容火狐浏览器
ie8本地图片上传预览出现问题是因为限制浏览器造访本地文件，所以用到滤镜和div，下面有个不错的示例，希望对大家有所帮助