js实现上传图片之上传前预览图片

　　上传图片对图片进行一下预览，可以了解图片上传后大概会是什么样子，此功能用js实现，然后在fileupload控件的change事件中调用，这样当用fileupload选择完图片以后，图片就会自动显示出来了。功能很简单，却很实用。

　　预览图片的js代码：

复制代码代码如下:

　　function setImagePreview(docObj,localImagId,imgObjPreview)

　　{

　　if(docObjfiles && docObjfiles[0])

　　{

　　//火狐下，直接设img属性

　　imgObjPreviewstyledisplay = 'block';

　　imgObjPreviewstylewidth = '300px';

　　imgObjPreviewstyleheight = '200px';

　　//火狐7以上版本不能用上面的getAsDataURL()方式获取，需要一下方式

　　imgObjPreviewsrc = windowURLcreateObjectURL(docObjfiles[0]);

　　}

　　else

　　{

　　//IE下，使用滤镜

　　docObjselect();

　　var imgSrc = documentselectioncreateRange()text;

　　//必须设置初始大小

　　localImagIdstylewidth = "300px";

　　localImagIdstyleheight = "200px";

　　//图片异常的捕捉，防止用户修改后缀来伪造图片

　　try

　　{

　　localImagIdstylefilter="progid:DXImageTransformMicrosoftAlphaImageLoader(sizingMethod=scale)";

　　localImagIdfiltersitem("DXImageTransformMicrosoftAlphaImageLoader")src = imgSrc;

　　}

　　catch(e)

　　{

　　alert("您上传的图片格式不正确，请重新选择!");

　　return false;

　　}

　　imgObjPreviewstyledisplay = 'none';

　　documentselectionempty();

　　}

　　return true;

　　}

　　</script>

　　fileupload控件及用来预览图片的image：

复制代码代码如下:

　　</div>

　　<asp:FileUpload ID="PicLoad" Width="300px" runat="server" onchange="javascript:setImagePreview(this,localImag,preview);">

　　</asp:FileUpload>

　　功能很简单，代码也很易懂，相信不用我多废话大家也能看懂吧。感觉写这样的文章，真的没啥好说的，不多说，还是把重点放在代码上吧。