js——通过隐藏input file上传文件并显示上传进度条

参考:https://www.cnblogs.com/fake718/p/3510687.html

   https://blog.csdn.net/x1172031988/article/details/70142895?utm_medium=distribute.pc_relevant_bbs_down.none-task--2~all~first_rank_v2~rank_v29-3.nonecase&depth_1-utm_source=distribute.pc_relevant_bbs_down.none-task--2~all~first_rank_v2~rank_v29-3.nonecase

          https://blog.csdn.net/weixin_34352005/article/details/91918449

效果

  进度条暂时没有接口调,不确定是否能实现

 代码

  https://github.com/plant9/upload_js

实现原理

  隐藏的文件上传input,通过点击其他元素,触发input的文件上传点击事件。

存在的兼容问题

  IE9及以下版本,由于JS安全问题,不允许JS访问本地文件,所以无法获取files。我参考链接3,通过ActiveXObject获取文件对象,但是还是没获取到==

input不设置为display:none的实现

  通过label及修改input[type=file]的样式,label方式参考链接2

position: absolute;
clip: rect(1px 1px 1px 1px);
原文地址:https://www.cnblogs.com/linjiangxian/p/14156338.html