原先直接用javasrcipt实现上传前图片预览,可在IE8里不能实现;前天新来了一个同事(Zendic[http://www.z-endic.info/])他说可以用jquery滤镜来实现,结果真的可以;先下载该.rar文件jquery_Files.rar,里面有两个js文件,一个是jquery的插件,另一个是实现图片预览的js文件;重述一下该功能:当选择一张图片时,判断是否会超出事先定义的宽跟高,如果超出了则提示图片不符合,并清空上传控件里的值;
下载后把两个js文件导入到页面里;
<script language="javascript" src="../javascripts/jquery-1.3.1.js"></script>
<script language="javascript" src="../javascripts/uploadPreview.js"></script>
然后写js代码:
<script language="javascript">
$(document).ready(function() {
$("#imgfile").uploadPreview({ width: 230, height: 200, imgDiv: "#imgDiv", imgType: ["bmp", "gif", "png", "jpg"], maxwidth: 230, maxheight: 200 });
});
</script>
在页面上写:
<input name="imgfile" type="file" id="imgfile" runat="server" size="40" />//上传控件
<div id="imgDiv"></div> //图片预览区
在上面的uploadPreview中, width: 230, height: 200表示图片缩放的宽跟高;maxwidth: 230, maxheight: 200 表示允许图片最大的宽跟高;