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

/qq_36687640/article/details/78551217

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>

---------------------

作者：Eva_大黎

来源：CSDN

原文：/qq_36687640/article/details/78551217

版权声明：本文为博主原创文章，转载请附上博文链接！