html5中file有属性accept,它规定能够通过文件上传进行提交的文件类型。支持IE 10+, Chrome, Firefox, Safari 6+, Opera 15+
html:
<input id='upload_img' name='myImage' type="file" accept="image/*">
或者
<input id='upload_img' name='myImage' type="file" accept="image/gif,image/jpeg,image/jpg,image/png,image/svg,image/bmp">
javascript:
document.getElementById('upload_img').onchange =function(){
var value=document.getElementById('upload_img').value;
var ind=value.lastIndexOf(".");
if(ind>=0){
value=value.substr(ind);
//image/gif,image/jpeg,image/jpg,image/png,image/svg
if(value.toLowerCase()!='gif'&&value.toLowerCase()!='jpeg'&&value.toLowerCase()!='jpg'&&value.toLowerCase()!='png'&&value.toLowerCase()!='svg'&&value.toLowerCase()!='bmp'){
alert("您上传的文件不符合图片格式,请上传图片。")
document.getElementById("upload_img").value="";
return;
}
}else{
alert("您上传的文件不符合图片格式,请上传图片。")
document.getElementById("upload_img").value="";
return;
}
}
提示: 请避免使用该属性。应该在服务器端验证文件上传。