我在网上看到好多人问如何使用FileUpload上传之前，先预览图片，前提条件，不允许先上传到服务器上！因为大多搜索的结果实现的方法都是先上传到服务器上，然后显示，如果不确定上传，就删除，这样的风险太大，性能也消耗很大！下面的代码告诉大家我们不需要先把图片上传到服务器上就可以预览了，是不是很酷！不说了，上代码【只能在IE下工作】！
Code
<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>Preview Image In FileUpload</title>
<style type="text/css">
#newPreview
{
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale);
}
</style>
</head>
<body>
<script language="javascript" type="text/javascript">
function PreviewImg(imgFile)
{
var newPreview = document.getElementById("newPreview");
newPreview.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = imgFile.value;
newPreview.style.width = "80px";
newPreview.style.height = "60px";
}
</script>
<form id="form2" runat="server">
<div>
<asp:FileUpload ID="FileUpload1" runat="server" onchange="PreviewImg(this)" />
</div>
<div id="newPreview">
</div>
<input type="file" onchange="document.getElementById('img').src=this.value" />
<img id="img">
</form>
</body>
</html>
当然，如果你有更好的方法，也可以共享出来和大伙分享，谢谢了。
另：建议您也看看我对Master Page 生命周期的总结：
http://www.cnblogs.com/OceanChen/archive/2009/02/09/1386543.html
【推荐】国内首个AI IDE，深度理解中文开发场景，立即下载体验Trae
【推荐】编程新体验，更懂你的AI，立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包，你的智能百科全书，全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell：AI 加持，快人一步
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语，封装的思维：从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热？
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列：向量存储与相似性搜索在 .NET 中的实现
· 周边上新：园子的第一款马克杯温暖上架
· Open-Sora 2.0 重磅开源！
· 分享 3 个 .NET 开源的文件压缩处理库，助力快速实现文件压缩解压功能！
· Ollama——大语言模型本地部署的极速利器
· [AI/GPT/综述] AI Agent的设计模式综述