input type='file' 上传文件时显示文件名及上传进度

1、input type='file' 上传文件时显示文件名及上传进度

<input type="file" οnchange="showPreview(this)">
<p class="show"></p>

<script> 
function showPreview(source) { 
var arrs = $(source).val().split('\\'); var filename=arrs[arrs.length-1]; $(".show").html(filename); 
var file = source.files[0]; 
var total = file.size; if(window.FileReader) { 
var fr = new FileReader(); 
fr.onprogress = function(e) { $(".progress1").show();
$("#Progress").val((e.loaded/total)*100) }; 
fr.οnabοrt=function () { 
layer.msg("文件上传中断,请重试")
 }; 
fr.οnerrοr=function () { 
layer.msg("文件上传出错，请重试") 
}; 
fr.οnlοad=function () { $(".progress1").hide(); 
layer.msg("文件上传成功")
 }; 
fr.readAsDataURL(file); 
} 
}
</script>