如何在客户端使用javascript/JQuery查看文件下载状态

<a href="path/to/file.pdf" download id="downloadLink">Download File</a>

$(document).ready(function() {
  $('#downloadLink').click(function() {
    // 下载开始前的操作，例如显示下载状态
    console.log('Download started');
  });
});

$(document).ready(function() {
  $('#downloadLink').click(function() {
    var xhr = new XMLHttpRequest();
    xhr.open('GET', 'path/to/file.pdf', true);
    xhr.responseType = 'blob';

    xhr.onload = function(e) {
      if (this.status === 200) {
        // 下载完成后的操作，例如隐藏下载状态
        console.log('Download completed');
      }
    };

    xhr.onprogress = function(e) {
      if (e.lengthComputable) {
        var percent = (e.loaded / e.total) * 100;
        // 更新下载进度，例如显示下载百分比
        console.log('Download progress: ' + percent + '%');
      }
    };

    xhr.send();
  });
});

$(document).ready(function() {
  $('#downloadLink').click(function() {
    $.ajax({
      url: 'path/to/file.pdf',
      method: 'GET',
      xhrFields: {
        responseType: 'blob'
      },
      success: function(data) {
        // 下载完成后的操作，例如隐藏下载状态
        console.log('Download completed');
      },
      progress: function(e) {
        if (e.lengthComputable) {
          var percent = (e.loaded / e.total) * 100;
          // 更新下载进度，例如显示下载百分比
          console.log('Download progress: ' + percent + '%');
        }
      }
    });
  });
});