欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

input的文件上传类型判断

程序员文章站 2024-02-19 12:36:34
...

参考网址:

  http://www.helloweba.com/view-blog-224.html

 

 

<p> 
   <label>请选择一个图像文件:</label> 
   <input type="file" id="file_input" /> 
</p>  
<div id="result"></div> 

  

var result = document.getElementById("result"); 
var input = document.getElementById("file_input"); 
 
if(typeof FileReader==='undefined'){ 
    result.innerHTML = "抱歉,你的浏览器不支持 FileReader"; 
    input.setAttribute('disabled','disabled'); 
}else{ 
    input.addEventListener('change',readFile,false); 
} 

function readFile(){ 
    var file = this.files[0]; 
    if(!/image\/\w+/.test(file.type)){ 
        alert("文件必须为图片!"); 
        return false; 
    } 
    var reader = new FileReader(); 
    reader.readAsDataURL(file); 
    reader.onload = function(e){ 
        result.innerHTML = '<img src="'+this.result+'" alt=""/>' 
    } 
} 

 获取文件的类型,名称,上传时间,移到本地的时间:

// var oDate=file.lastModifiedDate; //获取移到本地的时间


var oDate=new Date();
var sDate=oDate.getFullYear()+'-'+(oDate.getMonth()+1)+'-'+oDate.getDate(); //获取年,月,日,上传时间


var reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = function (e) {
result.innerHTML = file.type; //获取文件的类型
fileName.innerHTML = file.name; //获取文件的名称
fileTime.innerHTML = sDate; //获取上传时间
}
result.innerHTML = '<img src="'+this.result+'" alt=""/>'   //为获取图片原图