清风网络:老牌安全放心下载站! 下载排行 推荐软件 软件分类 最新文章 热点文章 最新软件 文章分类
软件文章
最新专题: 刻录工具 word 桌面工具 excel 打印机 2014手机炒股软件 wifi 购物汇总推荐 百度抢票专版 计算软件合集 打字练习 傲游浏览器 幻灯片制作 dreamweaver 定时关机
当前位置:清风网络网络编程Asp.Net → 图片在上传之前先预览,无需先上传到服务器上

2009-2-17 10:57:55 图片


  我在网上看到好多人问如何使用FileUpload上传之前,先预览图片,前提条件,不允许先上传到服务器上!因为大多搜索的结果实现的方法都是先上传到服务器上,然后显示,如果不确定上传,就删除,这样的风险太大,性能也消耗很大!下面的代码告诉大家我们不需要先把图片上传到服务器上就可以预览了,是不是很酷!不说了,上代码!
<%@ 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>

[1] [2] 下一页 

相关软件

文章评论

阅读排行

推荐文章

帮助(?) | 版权声明 | 友情连接 | 关于我们 | 信息发布
本站提供的软件来自互联网下载纯属学习交流之用,全部需要用迅雷工具下载,如侵犯您版权的请与我们联系,我们会尽快改正,请在下载24小时后删除。
www.vipcn.com 版权所有 蜀ICP备13015096号-5 Powered by:vipcn