我在网上看到好多人问如何使用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>
当然,如果你有更好的方法,也可以共享出来和大伙分享,谢谢了。
以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索服务器
, 图片
, fileupload
, microsoft
, 上传图片预览
, java图片上传预览
, 上传预览
, 上传到服务器
图片上传预览
,以便于您获取更多的相关知识。
时间: 2024-08-04 11:40:34