最近项目中用到的图片上传前预览功能，兼容IE6-9，FF
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<body>
<input type=file name="doc" id="doc" onchange="javascript:setImagePreview();">
<p>
<div id="localImag"><img id="preview" width=-1 height=-1 style="diplay:none" /></div>
</p>
<script>
function setImagePreview() {
var docObj=document.getElementById("doc");
var imgObjPreview=document.getElementById("preview");
if(docObj.files && docObj.files[0]){
//火狐下，直接设img属性
imgObjPreview.style.display = 'block';
imgObjPreview.style.width = '300px';
imgObjPreview.style.height = '120px';
//imgObjPreview.src = docObj.files[0].getAsDataURL();
//火狐7以上版本不能用上面的getAsDataURL()方式获取，需要一下方式
imgObjPreview.src = window.URL.createObjectURL(docObj.files[0]);
}else{
//IE下，使用滤镜
docObj.select();
var imgSrc = document.selection.createRange().text;
var localImagId = document.getElementById("localImag");
//必须设置初始大小
localImagId.style.width = "300px";
localImagId.style.height = "120px";
//图片异常的捕捉，防止用户修改后缀来伪造图片
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>
</body>
</html>
相关推荐
这个标题提到的"js预览图片 上传前预览图片 兼容ie6.7.8.9 ff 谷歌 opera 苹果浏览器"，表明这是一个旨在解决浏览器兼容性问题的解决方案，涵盖了老版本的Internet Explorer（IE6到IE9）以及Firefox、Chrome、Opera...
标题中的“上传图片预览-兼容IE6，IE7，IE8，FF”指的是一个Web开发的技术解决方案，目的是实现图片上传前的预览功能，并确保该功能在早期版本的Internet Explorer（IE6、IE7、IE8）以及Firefox浏览器上都能正常工作...
在JavaScript（简称JS）中实现图片预览，尤其是在兼容老版本的Internet Explorer（如IE6、IE7、IE8）以及Firefox（FF）等浏览器上，需要考虑多种技术策略和兼容性问题。下面我们将详细讨论如何实现这个功能，并着重...
这段代码是用于在图片上传前实现预览功能的，它兼容了Internet Explorer（IE）、Chrome 和 Firefox 这三种主流浏览器。在用户选择图片文件后，可以在网页上显示一个缩放后的预览图，确保预览图像的宽度和高度不超过...
标题中提到的“兼容ie6、ie7、ie8 和FF的本地上传图片预览”主要涉及以下技术点： 1. **FileReader API**：这是一个HTML5的新特性，用于读取文件。在支持的浏览器中，可以通过`FileReader.readAsDataURL(file)`方法...
本项目 "[php]ifame仿ajax图片上传预览,兼容IE\FF\Chrome" 提供了一种利用iframe技术实现跨浏览器兼容的图片上传预览方案。以下是关于这个项目的一些关键知识点和详细说明： 1. **Iframe（内联框架）**：Iframe是一...
#### 标题解析：“ie6 ie7 ff浏览器兼容” 该标题明确指出了文章关注的核心问题——即确保网页能在IE6、IE7及Firefox等浏览器中正确显示。这意味着开发者需要采取一定的措施来适配这些浏览器，确保无论用户使用何种...
本示例主要探讨如何使用JavaScript结合IFrame技术来实现异步图片上传，并提供预览功能，同时确保兼容Firefox、Chrome和IE9等主流浏览器。 首先，我们需要了解异步上传的基本原理。异步上传，也称为Ajax上传，是指在...
标题中的“图片预览(兼容FF,IE7)”指的是创建了一个功能，允许用户在浏览器上预览图片，这个功能同时支持Firefox（FF）和Internet Explorer 7（IE7）这两种浏览器。在早期的Web开发中，由于不同浏览器对某些技术的...
在网页开发中，图片上传预览功能是一项常见且重要的需求，尤其在用户需要在上传前确认图片效果时。本文将详细讲解如何实现IE（Internet Explorer）和FF（Firefox）浏览器的图片上传预览功能，以及处理这两种浏览器在...
在提供的压缩包中，"calendar-IE6,7,FF"可能是专为IE6、7和Firefox优化的日期选择控件实现。开发者需要下载并查看其源代码，了解具体的实现方式和使用方法。通过研究这些代码，可以学习到如何构建一个高效且兼容多...
本篇文章将深入探讨一个关键问题——如何实现本地图片上传并预览的功能，并兼容IE6、IE7和IE8。这个功能对于现代浏览器来说是相当基础的，但在老版本的IE中，由于其内核和API的限制，实现起来并不简单。 首先，我们...
### CSS完美兼容IE6、IE7与Firefox的通用方法详解 在Web开发的历史长河中，浏览器兼容性一直是开发者面临的重大挑战，尤其是处理早期版本的Internet Explorer（IE6和IE7）与现代浏览器如Firefox之间的差异。本文将...
"兼容ff的上传图片预览功能示例"这个标题表明了这个代码实例或教程主要目标是确保在Firefox浏览器中能够正常运行的图片预览功能。 通常，图片预览功能依赖于HTML5的File API，包括`<input type="file">`元素和`...
标题中的"兼容ie6,ie7.ff"指的是该效果不仅适用于现代浏览器，如Firefox（ff），还特别考虑了对旧版本Internet Explorer（ie6, ie7）的支持，因为这些老版本的浏览器在处理CSS和JavaScript时可能存在兼容性问题。...
### CSS完美兼容IE6_IE7_FF的通用方法 在网页设计与开发过程中，浏览器兼容性问题一直是前端开发者面临的重要挑战之一。特别是在早期的Web开发中，如何让网站同时兼容Internet Explorer 6（简称IE6）、Internet ...