實現的功能：
1.限制上傳的文件只能爲圖片
2.限制上傳圖片的大小
3.允許連續上傳同一圖片
代碼如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>上傳圖片</title>
<style type="text/css">
img{
height: 150px;
max-width: 300px
}
</style>
</head>
<body>
<!-- multiple屬性:允許一次上傳多個文件 -->
<input id="upload" type="file" name="" multiple="">
<div id="img-div"></div>
<script type="text/javascript">
var dom = document.getElementById('upload')
dom.onchange = function(event){
//獲取元素節點
var target = event.target || event.srcElement;
console.log(target.files)
for( var i = 0; i < target.files.length; i ++ ){
var file = target.files[i];
if( !/image\/\w+/.test(file.type) ){
alert('文件必須爲圖片！')
return
}else if( file.size > 2097152 ){
alert('上傳圖片請小於2M')
return
}
var reader = new FileReader();
reader.onload = function() {
//獲取元素節點
var imgDom = document.getElementById('img-div');
imgDom.innerHTML += '<img class="showPic" src=' + this.result + '>'
//防止兩次上傳同一文件無法觸發onchange事件
//假設第一次上傳的文件是1.png，第二次又想上傳這張圖片，如果缺少這句代碼，則第二次無法觸發onchange事件
event.target.value=''
}
reader.readAsDataURL(file)
}
}
</script>
</body>
</html>