当前位置: 代码迷 >> ASP.NET >> 上传图片预览效果,该怎么处理
  详细解决方案

上传图片预览效果,该怎么处理

热度:4933   发布时间:2013-02-25 00:00:00.0
上传图片预览效果
一个img标签 ,一个FileUpload控件 

FileUpload控件选中一种图片,让img标签显示出来

要所有的浏览器下都兼容 不知是否可实现,求高手指点 有源码更好,先谢谢各位了

------解决方案--------------------------------------------------------
参考孟子e章的文章
多图片上传+图片预览,兼容所有浏览器 IE5/IE6/IE7/IE8/IE9/Chrome/Safari/Firefox/Opera/
------解决方案--------------------------------------------------------
先本地显示
------解决方案--------------------------------------------------------
探讨

参考孟子e章的文章
多图片上传+图片预览,兼容所有浏览器 IE5/IE6/IE7/IE8/IE9/Chrome/Safari/Firefox/Opera/

------解决方案--------------------------------------------------------
留个脚印
之前做过一次 看来可以仿照孟哥的在优化了
------解决方案--------------------------------------------------------
http://www.open-lib.com/Type/201-1.jsp

这里效果很多

------解决方案--------------------------------------------------------
HTML code
<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;             }         }     </script>     </head>     <body>         <input type="file" onchange="document.getElementById('img').src=getFullPath(this);" />     <img id="img" height="174" width="234"/>     </body> </html>
------解决方案--------------------------------------------------------
想要兼容性好 还是首选flash.
需要DEmo留邮箱.

------解决方案--------------------------------------------------------
探讨

引用:
参考孟子e章的文章
多图片上传+图片预览,兼容所有浏览器 IE5/IE6/IE7/IE8/IE9/Chrome/Safari/Firefox/Opera/

有没有简单点的,用javascript操作的,而且图片不需要保存到服务器上面去,

------解决方案--------------------------------------------------------
你单指预览的话 flash 吧
------解决方案--------------------------------------------------------
案例,多图片浏览上传
------解决方案--------------------------------------------------------
不知道你做这个的用途,FileUpload里直接用‘缩略图’模式查看不就看到图片了?
------解决方案--------------------------------------------------------
<title>无标题页</title>
<script type="text/javascript">
function show1(upimg)
{
var dd=document.getElementById("divview");
dd.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = upimg;
dd.style.width = 100;
dd.style.height = 100;
dd.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").sizingMethod = 'scale';
}
</script>

</head>
<body>
<form id="form1" runat="server">
<div>
<asp:FileUpload ID="fuFile" onpropertychange="show1(this.value)" runat="server" />
div的样式<br />
<div id="divview" style="Filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=image); width: 100px; height: 100px;">
  相关解决方案