input file标签实现JS图片上传预览效果 选择图片后能立即查看图片

分类:Javascript| 发布:camnprbubuol| 查看: | 发表时间:2013/5/23

图片预览主要包括两个部分:从file表单控件获取图像数据,根据数据显示预览图像。

图片上传预览是一种在图片上传之前对图片进行本地预览的技术。
使用户选择图片后能立即查看图片,而不需上传服务器,提高用户体验。
但随着浏览器安全性的提高,要实现图片上传预览也越来越困难。
不过群众的智慧是无限的,网上已经有很多变通或先进的方法来实现。
例如ie7/ie8的滤镜预览法,firefox 3的getAsDataURL方法。
但在opera、safari和chrome还是没有办法实现本地预览,只能通过后台来支持预览。

在线效果演示

官方完整实例下载(asp.net版)  & [本地完整实例下载(asp.net版)]

官方完整实例下载(asp版)

felsenlee提供的jsp版:官方完整实例下载(jsp版)

365据说看到好文章不转的人,服务器容易宕机
原创文章如转载,请注明:转载自郑州网建-前端开发 http://camnpr.com/
本文链接:http://camnpr.com/archives/image-upload-preview-the-effect.html