兼容ie和火狐支持获取图片大小和显示代码,JS代码库,德仔网

代码语言

代码分类

【JS】兼容ie和火狐支持获取图片大小和显示

作者:ChengDong / 发布于2015/2/28/ 622


	<html>
	<head>
	 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	 <title>用户中心</title>
	 <base href=""/>
	 <meta http-equiv="keywords" content="${keywords}">
	 <meta http-equiv="description" content="${description}">
	 <script type="text/javascript">
	 function perImg(o){
	 var filepath = "";//文件路径
	 var agent=window.navigator.userAgent;
	 var isIE7 = agent.indexOf('MSIE 7.0') != -1;
	 var isIE8 = agent.indexOf('MSIE 8.0') != -1;
	 if( !o.value.match(/.jpg|.gif|.png|.bmp/i)){
	 alert('图片格式无效！');
	 return;
	 }
	 if(agent.indexOf("Firefox")!=-1){
	 //火狐浏览器判断
	 document.getElementById("preview").src = o.files[0].getAsDataURL();//显示预览图
	 alert(document.getElementById("preview").src);
	 var fileSize=GetFileSize(o); //获取文件大小
	 alert(fileSize);
	 if(fileSize>1024*1024){
	 alert("文件不能大于1M");
	 }else{
	 alert("文件符合大小");
	 }
	 }else{//IE浏览器
	 document.getElementById("preview").src =o.value; //显示预览图片
	 var img=new Image();//动态创建img
	 alert(o.value)
	 img.src=o.value;
	 img.style.display="none";
	 if(img.readyState=="complete"){//已经load完毕，直接打印文件大小
	 alert(img.fileSize);//ie获取文件大小
	 }else{
	 img.onreadystatechange=function(){
	 if(img.readyState=='complete'){//当图片load完毕
	 alert(img.fileSize);//ie获取文件大小
	 }
	 }
	 }
	 }
	 }
	 //FF判断文件大小函数
	 function GetFileSize(fileObj)　　
	 {　　
	　 var image=new Image();
	 var filePath=fileObj.value;
	　 image.dynsrc=filePath;
	　 var fileSize=image.fileSize||0;
	 if(fileSize==0)
	 {
	 fileSize=fileObj.files[0].fileSize;
	 }
	 return fileSize;
	 }
	 </script>

	</head>
	<body>
	 <div>
	 <img id="preview" style="width: 80px; height: 85px; border: 0px;" />
	 </div>
	 
	 <input type="file" id="file" name="file" onchange="perImg(this)" />
	</body>
	</html>

试试其它关键字

　获取图片大小　　图片大小　

同语言下

可能有用的

ChengDong贡献的其它代码(7)