js下载文件 监听下载完成事件

<script src="xxx/layui/layui.js"></script>
<script src="xxx/jquery.min.js"></script>
<script>
  var down_windows;

  function exportAll(){
    var url  = "xxx.xls";

    // 现在使用的方法 可在下载完成的时候关闭load弹窗
    getDownload(url);

    // 之前使用的方法 存在的问题就是 如果文件下载很慢 用户以为没有点击上 会重复点击 如果加上load弹窗 由于无法监听下载完成事件 无法在下载完成瞬间关闭load弹窗
    // window.location.href = "<{:url('/contract.Index/out')}>" + "?branch_id="+branch_id+"&name="+name;
  }


  //填写你的下载时加载的操作
  load = function() {
    down_windows = layer.load(1, {
      shade: [0.5,'#fff'] //0.1透明度的白色背景
    });
  }
  //下载完成后触发,用来关闭提示框
  disload = function() {
    layer.close(down_windows)
  }
  // 下载使用的方法
  getDownload = function(url) {
    load();
    var xhr = new XMLHttpRequest();
    xhr.open('GET', url, true);    // 也可用POST方式
    xhr.responseType = "blob";
    xhr.onload = function () {
      if (this.status === 200) {
        var blob = this.response;
        if (navigator.msSaveBlob == null) {
          var a = document.createElement('a');
          var headerName = xhr.getResponseHeader("Content-disposition");
          a.download = decodeURIComponent(headerName).substring(20);
          a.href = URL.createObjectURL(blob);
          $("body").append(a);    // 修复firefox中无法触发click
          a.click();
          URL.revokeObjectURL(a.href);
          $(a).remove();
        } else {
          navigator.msSaveBlob(blob, decodeURIComponent(headerName).substring(20));
        }
      }
      disload();
    };
    xhr.send()
  };

</script>

代码是百度来的 本来准备写出处的 但是页面关掉了 再次百度的时候 一大堆类似的内容 我也不知道谁是原作者 也不清楚刚刚是复制的谁的 所以写不了出处了

  • 0
    点赞
  • 10
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值