Chinaunix首页 | 论坛 | 博客
  • 博客访问: 682363
  • 博文数量: 109
  • 博客积分: 2033
  • 博客等级: 大尉
  • 技术积分: 1454
  • 用 户 组: 普通用户
  • 注册时间: 2011-03-11 13:26
文章分类

全部博文(109)

文章存档

2012年(5)

2011年(104)

分类: Python/Ruby

2011-03-20 08:45:58

 

 

JS实现上传本地图片前预览图片,兼容IE6和IE7,有很多这样的代码,但不知道为什么会在IE7下失效,于是将以前的修正了一下,这下可以完全兼容IE6和IE7,实用性大大增强,也方便了用户在上传图片前确认自己将要上传的图片是否正确。

  1. <html>
  2. <head>
  3. <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
  4. <title>JS上传前预览图片</title>
  5. <script type="text/javascript" language="javascript">
  6. <!--
  7. function PreviewImg(imgFile){
  8.     var newPreview = document.getElementById("newPreview");
  9.     var imgDiv = document.createElement("div");
  10.     document.body.appendChild(imgDiv);
  11.     imgDiv.style.width = "118px"; imgDiv.style.height = "127px";
  12.     imgDiv.style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod = scale)";
  13.     imgDiv.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = imgFile.value;
  14.     newPreview.appendChild(imgDiv);
  15.     var showPicUrl = document.getElementById("showPicUrl");
  16.     showPicUrl.innerText=imgFile.value;
  17.     newPreview.style.width = "80px";
  18.     newPreview.style.height = "60px";
  19. }
  20. -->
  21. </script>
  22.     </head>
  23.     <body>
  24.         <p>兼容IE6、IE7</p>
  25.         <div id="newPreview"></div>
  26.         <div id="showPicUrl"></div>
  27.         <hr />
  28.         <p>
  29.             选择图片:<input type="file" size="20" onchange="javascript:PreviewImg(this);" />
  30.         </p>
  31.     </body>
  32. </html>
阅读(2001) | 评论(0) | 转发(0) |
给主人留下些什么吧!~~