版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/lyxuefeng/article/details/82192323
效果：选择文件后，得到文件格式并验证是否选择正确
关键知识：onchange事件,字符串常用方法substr(),lastIndexOf()
具体代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>验证文件格式</title>
</head>
<body>
<input type="file" id="File" name=""/><span></span>
</body>
<script type="text/javascript">
var file = document.getElementById('File');
file.onchange = function(){
//选择文件后的操作
// alert('file');
//alert(this.value);//得到的是现在的文件路径
var path = this.value;
var houzhui = path.substr(path.lastIndexOf('.'));//得到后缀，从倒数第一个点开始截取
var suxxif = houzhui.toLowerCase();//把后缀全部转换成小写，有的后缀可能是大写,也可用toUpperCase()全部转换成大写判断
console.log(suxxif);
if(suxxif == '.jpg' || suxxif == '.png' || suxxif == '.mp3' || suxxif == ".mp4"){
this.nextSibling.innerHTML = '格式正确';
}else{
this.nextSibling.innerHTML = '格式选择错误';
}
}
</script>
</html>具体效果可见：验证文件格式