在做项目的时候，需要根据是否上传图片，（前提是已经上传文件，再次上传取消时，监听取消事件）进而判断页面变化。通过查阅相关资料，发现chane事件并不能监听取消，于是从另外一种角度：判断上传的文件是否有值，进而监听取消事件。

<input type="file" id="batchUpload"
 name="files" 
 accept="image/jpg, image/gif,image/png, image/jpeg" 
 multiple="multiple">
	var batchUpload = document.querySelector('#batchUpload');
	 batchUpload.click();
	 batchUpload.addEventListener('change', function () {            
                   var filesList = document.querySelector('#batchUpload').files;
                   if(filesList.length==0){         //如果取消上传，则改文件的长度为0         
                       return;
                   }else{  
                   	//如果有文件上传，这在这里面进行
                }); 
通过上述代码可以发现，当我们上传文件时，如果取消上传，document.querySelector('#batchUpload').files.length==0，反之如果有文件上传，则其上传的文件长度会大于0，所以我们可以借此对取消事件进行监听
                                    &lt;script type="text/javascript"&gt;window.onbeforeunload = function (e) {  e = e || window.event;  // 兼容IE8和Firefox 4之前的版本  if (e) {    e.returnValue = '关闭提示';  }  // Chrome, Safari, Firefox 4+, Ope...
                                    本教程案例在线演示有路网PC端 有路网移动端免费配套视频教程免费配套视频教程教程配套源码资源教程配套源码资源制作有路网首页有路网首页布局框架制作划分区域，确定div 测量各个区域的宽高 使用Flexbox对网页进行布局youlu-whole.css.nav{
  height: 30px;
  background-color: #f4f4f4;
.search-bar{
  height...
                                    目的主要是使用javascript:window.open()对浏览器 iE6.0,7.0,8.0,chorme,safari,firefox适用刚开始的时候对最大化使用<a href="javascript:void window.open('https://www.sina. com.cn/ ','XX','fullscreen,scrollbars,resizab...
                                    按下Esc键时，将会触发keyup.esc事件，也可以使用v-on指令监听该事件并做出相应的处理。方法来监听键盘事件，然后在检测到ESC键按下时，调用关闭弹框的方法来实现关闭弹框的功能。在Vue中，可以通过监听窗口上的键盘事件来实现ESC键关闭弹框的功能。例如，可以在组件的mounted() 钩子函数中使用。
                                    在做项目的时候，需要根据是否上传图片，（前提是已经上传文件，再次上传取消时，监听取消事件）进而判断页面变化。通过查阅相关资料，发现change事件并不能监听取消，于是从另外一种角度：判断上传的文件是否有值，进而监听取消事件。
                                    JS针对浏览器窗口关闭事件的监听方法集锦本文实例总结了JS针对浏览器窗口关闭事件的监听方法。分享给大家供大家参考，具体如下：方式一：(适用于IE浏览器，而且刷新不提示，只在点击浏览器关闭按钮的时候提示)window.onbeforeunload=onclose;function onclose(){if(event.clientX>document.body.clientWidth&...
                                    在用element中的el-upload方法，并且使用el-progress进度条实现取消上传的功能时候，当点击上传后，进度条正常显示百分比的进度，但是当点击”取消“后，再继续点击”上传“后，发现无法上传，尤其是第一次上传大视频文件（超过800M以上）的时候，这个问题必现，后来查看element的API:
https://element.eleme.cn/#/zh-CN/component/upload
发现有一个abort取消上传请求的方法，在el-upload中加入
ref="upload"
<div class="thumb-box">
    <!-- 头像 -->
    <img src="./images/cover.jpg" id="userImg" class="img-thumbnail thumb" alt="">
    <div class="mt-2">
      <!-- 文件选择框 -->
      <!-- accept 属性表示可选择的文件类型 -->
                                    默认的input上传文件，无法监听到选取文件窗口上的取消按钮后的事件，想了一个曲线救国的方法，下面是例子
<button onclick="upFile()">上传文件</button>
<input type="file" style="display: none;" name="file" id="file" />
<input
  type="text"
  autocomplete="off"
  style="opacity: 0;width: 0px;h
QQ群：602504799
如若有不理解的，可加QQ群进行咨询了解
实现思路，当电脑的资源管理器被打开的时候，浏览将会处于一个等待的状态，相当于资源管理器被打开类似于js里面的一个await Promise一样。浏览器的所有事件将会进行被阻塞。
于是我们可以利用这一点来进行实现监听资源管理器是否关闭，判断input file是否有进行选择文件。
在我们进行打开资源管理器的时候，我们顺便个document加上一个鼠标移动事件（mousemove）当该事件被触发的时候，就说明资源管理器已经关