Ringkasan kaedah JS untuk mendapatkan kemahiran saiz_javascript fail-tutorial js-php.cn

Rumah

hujung hadapan web

tutorial js

Ringkasan kaedah JS untuk mendapatkan kemahiran saiz_javascript fail

May 16, 2016 pm 03:27 PM

js saiz fail dapatkan

Contoh dalam artikel ini meringkaskan kaedah JS untuk mendapatkan saiz fail. Kongsikan dengan semua orang untuk rujukan anda, butirannya adalah seperti berikut:

Kaedah 1, menggunakan kawalan ActiveX:

&lt;script type="text/javascript"&gt;
function getFileSize(filePath)
{
  var fso = new ActiveXObject("Scripting.FileSystemObject");
  alert("文件大小为："+fso.GetFile(filePath).size);
}
&lt;/script&gt;
&lt;body&gt;
&lt;INPUT TYPE="file" NAME="file" SIZE="30" onchange="getFileSize(this.value);"&gt;
&lt;/body&gt;

Salin selepas log masuk

Kaedah ini boleh digunakan dalam IE akan terdapat gesaan keselamatan jika terdapat sebarang kekurangan Menukar nama fail kepada .hta akan menyekat gesaan keselamatan.

Kaedah 2, gunakan atribut dynsrc img:

Kod:

&lt;script type="text/javascript"&gt;
function getFileSize(filePath)
{
  var image=new Image();
  image.dynsrc=filePath;
  alert(image.fileSize);
}
&lt;/script&gt;
&lt;body&gt;
&lt;INPUT TYPE="file" NAME="file" SIZE="30" onchange="getFileSize(this.value)"&gt;
&lt;/body&gt;

Salin selepas log masuk

Kaedah ini boleh digunakan dalam IE6, tetapi tidak boleh digunakan dalam IE7, IE8, Firefox dan chrome.

Kaedah ketiga, gunakan Saiz fail img:

Kod:

&lt;script language=javascript&gt; 
var ImgObj=new Image(); //建立一个图像对象 
var AllImgExt=".jpg|.jpeg|.gif|.bmp|.png|"//全部图片格式类型 
var FileObj,ImgFileSize,ImgWidth,ImgHeight,FileExt,ErrMsg,FileMsg,HasCheked,IsImg//全局变量 图片相关属性 
//以下为限制变量 
var AllowExt=".jpg|.gif|.doc|.txt|" //允许上传的文件类型 &#63;为无限制 每个扩展名后边要加一个"|" 小写字母表示 
//var AllowExt=0 
var AllowImgFileSize=70;  //允许上传图片文件的大小 0为无限制 单位：KB 
var AllowImgWidth=500;   //允许上传的图片的宽度 &#63;为无限制 单位：px(像素) 
var AllowImgHeight=500;   //允许上传的图片的高度 &#63;为无限制 单位：px(像素) 
HasChecked=false; 
function CheckProperty(obj)  //检测图像属性 
{ 
 FileObj=obj; 
 if(ErrMsg!="")   //检测是否为正确的图像文件 返回出错信息并重置 
 { 
   ShowMsg(ErrMsg,false); 
   return false;   //返回 
 } 
 if(ImgObj.readyState!="complete") //如果图像是未加载完成进行循环检测 
 { 
   setTimeout("CheckProperty(FileObj)",500); 
   return false; 
 } 
 ImgFileSize=Math.round(ImgObj.fileSize/1024*100)/100;//取得图片文件的大小 
 ImgWidth=ImgObj.width   //取得图片的宽度 
 ImgHeight=ImgObj.height;  //取得图片的高度 
 FileMsg="\n图片大小:"+ImgWidth+"*"+ImgHeight+"px"; 
 FileMsg=FileMsg+"\n图片文件大小:"+ImgFileSize+"Kb"; 
 FileMsg=FileMsg+"\n图片文件扩展名:"+FileExt; 
 if(AllowImgWidth!=0&&AllowImgWidth&lt;ImgWidth) 
   ErrMsg=ErrMsg+"\n图片宽度超过限制。请上传宽度小于"+AllowImgWidth+"px的文件，当前图片宽度为"+ImgWidth+"px"; 
 if(AllowImgHeight!=0&&AllowImgHeight&lt;ImgHeight) 
   ErrMsg=ErrMsg+"\n图片高度超过限制。请上传高度小于"+AllowImgHeight+"px的文件，当前图片高度为"+ImgHeight+"px"; 
 if(AllowImgFileSize!=0&&AllowImgFileSize&lt;ImgFileSize) 
   ErrMsg=ErrMsg+"\n图片文件大小超过限制。请上传小于"+AllowImgFileSize+"KB的文件，当前文件大小为"+ImgFileSize+"KB"; 
 if(ErrMsg!="") 
   ShowMsg(ErrMsg,false); 
 else 
   ShowMsg(FileMsg,true); 
 } 
 ImgObj.onerror=function(){ErrMsg='\n图片格式不正确或者图片已损坏!'} 
 function ShowMsg(msg,tf) //显示提示信息 tf=true 显示文件信息 tf=false 显示错误信息 msg-信息内容 
 { 
 msg=msg.replace("\n","&lt;li&gt;"); 
 msg=msg.replace(/\n/gi,"&lt;li&gt;"); 
 if(!tf) 
 { 
   document.all.UploadButton.disabled=true; 
   FileObj.outerHTML=FileObj.outerHTML; 
   MsgList.innerHTML=msg; 
   HasChecked=false; 
 } 
 else 
 { 
   document.all.UploadButton.disabled=false; 
   if(IsImg) 
    PreviewImg.innerHTML="&lt;img src='"+ImgObj.src+"' width='60' height='60'&gt;" 
   else 
    PreviewImg.innerHTML="非图片文件"; 
    MsgList.innerHTML=msg; 
    HasChecked=true; 
 } 
} 
function CheckExt(obj) 
{ 
 ErrMsg=""; 
 FileMsg=""; 
 FileObj=obj; 
 IsImg=false; 
 HasChecked=false; 
 PreviewImg.innerHTML="预览区"; 
 if(obj.value=="")return false; 
 MsgList.innerHTML="文件信息处理中..."; 
 document.all.UploadButton.disabled=true; 
 FileExt=obj.value.substr(obj.value.lastIndexOf(".")).toLowerCase(); 
 if(AllowExt!=0&&AllowExt.indexOf(FileExt+"|")==-1) //判断文件类型是否允许上传 
 { 
   ErrMsg="\n该文件类型不允许上传。请上传 "+AllowExt+" 类型的文件，当前文件类型为"+FileExt; 
   ShowMsg(ErrMsg,false); 
   return false; 
 } 
 if(AllImgExt.indexOf(FileExt+"|")!=-1)  //如果图片文件，则进行图片信息处理 
 { 
   IsImg=true; 
   ImgObj.src=obj.value; 
   CheckProperty(obj); 
   return false; 
 } 
 else 
 { 
   FileMsg="\n文件扩展名:"+FileExt; 
   ShowMsg(FileMsg,true); 
 } 
 
 } 
 function SwitchUpType(tf) 
 { 
   if(tf) 
   str='&lt;input type="file" name="file1" onchange="CheckExt(this)" style="width:180px;"&gt;' 
   else 
   str='&lt;input type="text" name="file1" onblur="CheckExt(this)" style="width:180px;"&gt;' 
   document.all.file1.outerHTML=str; 
   document.all.UploadButton.disabled=true; 
   MsgList.innerHTML=""; 
 } 
 &lt;/script&gt; 
 &lt;form enctype="multipart/form-data" method="POST" onsubmit="return HasChecked;"&gt; 
 &lt;fieldset style="width: 372; height: 60;padding:2px;"&gt; 
 &lt;legend&gt;&lt;font color="#FF0000"&gt;图片来源&lt;/font&gt;&lt;/legend&gt; 
 &lt;input type="radio" name="radio1" checked onclick="SwitchUpType(true);"&gt;本地&lt;input type="radio" name="radio1" onclick="SwitchUpType(false);"&gt;远程：&lt;input type="file" name="file1" onchange="CheckExt(this)" style="width:180px;"&gt; &lt;input type="submit" id="UploadButton" value="开始上传" disabled&gt; 
 &lt;div style="border:1 solid #808080;background:#E0E0E0;width100%;height:20px;color:#606060;padding:5px;"&gt; 
 &lt;table border="0"&gt;&lt;tr&gt;&lt;td width="60" id="PreviewImg"&gt;预览区&lt;/td&gt;&lt;td id="MsgList" valign="top"&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt; 
 &lt;/div&gt; 
 &lt;/fieldset&gt; 
 &lt;/form&gt;

Salin selepas log masuk

Ia boleh digunakan dalam IE, FireFox dan chrome, tetapi ia hanya menentukan saiz fail imej.

Lampiran: js untuk menentukan format dan saiz fail

//判断照片大小
function getPhotoSize(obj){
  photoExt=obj.value.substr(obj.value.lastIndexOf(".")).toLowerCase();//获得文件后缀名
  if(photoExt!='.jpg'){
    alert("请上传后缀名为jpg的照片!");
    return false;
  }
  var fileSize = 0;
  var isIE = /msie/i.test(navigator.userAgent) && !window.opera;      
  if (isIE && !obj.files) {     
     var filePath = obj.value;      
     var fileSystem = new ActiveXObject("Scripting.FileSystemObject");  
     var file = fileSystem.GetFile (filePath);        
     fileSize = file.Size;     
  }else { 
     fileSize = obj.files[0].size;   
  } 
  fileSize=Math.round(fileSize/1024*100)/100; //单位为KB
  if(fileSize&gt;=10){
    alert("照片最大尺寸为10KB，请重新上传!");
    return false;
  }
}

Salin selepas log masuk

halaman jsp:

Salin kod Kod adalah seperti berikut:

<input type="file" id="imgFile " name="upload" style="width:150px;" onchange="getPhotoSize(this)"/>

Saya harap artikel ini akan membantu semua orang dalam pengaturcaraan JavaScript.

Kenyataan Laman Web ini

Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn