当前位置: 代码迷 >> Web前端 >> 文件下传之图片预览
  详细解决方案

文件下传之图片预览

热度:30   发布时间:2012-11-23 22:54:33.0
文件上传之图片预览
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<script src="jquery-1.4.4.js"></script>
 <script language='javascript'> 
        function getFullPath(obj) 
        { 
            if(obj) 
            { 
                //ie 
                if ($.browser.msie) 
                { 
                    obj.select(); 
                    return document.selection.createRange().text; 
                } 
                //firefox 
                else if($.browser.mozilla) 
                { 
                    if(obj.files) 
                    { 
                        return obj.files.item(0).getAsDataURL(); 
                    } 
                    return obj.value; 
                } 
                return obj.value; 
            } 
        } 

		function showImg(src){
			$("#img").css("display","");
			$("#img").attr("src",src);
		}
    </script> 


</head>

<body>
	<div>
		<input id="f1" name="f1" type="file" onchange="showImg(getFullPath(this));" />
   </div>

   <div>
		<img id="img" alt="" style="display:none" />
   </div>
</body>

</html>


  相关解决方案