最近要做一个头像上传设置,于是在网上百了很多例子都没有中意的,俗话说的好,柳暗花明又一村,终于找到了,那就是她。很实用的一个demo。网址是
http://www.cnblogs.com/cloudgamer/archive/2009/12/22/ImagePreview.html
下载其中的
<a href="http://files.cnblogs.com/cloudgamer/ImagePreview_asp.rar">完整实例下载(asp版)</a>
使用技巧
一般来preview方法都是在onchange中调用,即选择文件后立即显示预览。
在不需要程序时最好执行一次dispose方法来销毁程序,防止内存泄漏等。
利用ImagePreview.TRANSPARENT可以显示透明图片,而不需另外隐藏或增加文件。
第二个实例中的ResetFile是用来重置file控件的,详细参考这里file的reset。
而file控件样式设置详细参考这里的file样式。
asp版本使用Persits.Jpeg组件缩放图片,测试请先安装该组件。
使用说明
实例化时,有两个必要参数,分别是file控件对象和img元素的预览显示对象:
new ImagePreview( file, img );
可选参数用来设置系统的默认属性,包括:
属性: 默认值//说明
mode: ImagePreview.MODE,//预览模式
ratio: 0,//自定义比例
maxWidth: 0,//缩略图宽度
maxHeight: 0,//缩略图高度
onCheck: function(){},//预览检测时执行
onShow: function(){},//预览图片时执行
onErr: function(){},//预览错误时执行
以下在remote模式时有效
action: undefined,//设置action
timeout: 0//设置超时(0为不设置)
如果要使用remote模式必须设置一个action。
还提供了以下方法:
preview:执行预览操作;
dispose:销毁程序。