当前位置: 主页 > js学习网 > JavaScript教程 >

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

时间:2014-10-20 16:42来源:乐呵网提供 作者:乐呵网 点击:
此功能用js实现,然后在fileupload控件的change事件中调用,这样当用fileupload选择完图片以后,图片就会自动显示出来了
//火狐下,直接设img属性
{
localImagIdstylewidth = "300px";
<img alt="预览图片" src="//Images/noImagegif" />
imgObjPreviewstyledisplay = 'block';
else

上传图片对图片举办一下预览,可以相识图片上传后或许会是什么样子,此成果用js实现,然后在fileupload控件的change事件中挪用,这样当用fileupload选择完图片今后,图片就会自动显示出来了。成果很简朴,却很实用。
return false;
alert("您上传的图片名目不正确,请从头选择!");

</div>

docObjselect();
}
localImagIdstyleheight = "200px";
代码如下:
</script>
}
imgObjPreviewstyleheight = '200px';
//IE下,利用滤镜
</asp:FileUpload>
{
}
var imgSrc = documentselectioncreateRange()text;
documentselectionempty();
<script type="text/javascript">
localImagIdstylefilter="progid:DXImageTransformMicrosoftAlphaImageLoader(sizingMethod=scale)";
预览图片的js代码:
<asp:FileUpload runat="server" onchange="javascript:setImagePreview(this,localImag,preview);">
{
imgObjPreviewsrc = windowURLcreateObjectURL(docObjfiles[0]);
代码如下:

imgObjPreviewstylewidth = '300px';
catch(e)
{
}
<div>
function setImagePreview(docObj,localImagId,imgObjPreview)
fileupload控件及用来预览图片的image:
成果很简朴,代码也很易懂,相信不消我多空话各人也能看懂吧。感受写这样的文章,真的没啥好说的,不多说,照旧把重点放在代码上吧。

}
//图片异常的捕获,防备用户修改后缀来伪造图片
if(docObjfiles && docObjfiles[0])
{
imgObjPreviewstyledisplay = 'none';
try
//必需配置初始巨细
//火狐7以上版本不能用上面的getAsDataURL()方法获取,需要一下方法
return true;
localImagIdfiltersitem("DXImageTransformMicrosoftAlphaImageLoader")src = imgSrc;
(责任编辑:admin)
------分隔线----------------------------
栏目列表
推荐内容