通过按Escape键中止AJAX文件上传

Question

我正在尝试abort()上传AJAX文件。我尝试添加事件侦听器，并尝试将abort()设置为keypress，尽管我在控制台中未看到任何内容。此[[必须无需任何框架即可完成。

function myFunction()
{
 var xhr = new XMLHttpRequest();

 xhr.upload.addEventListener('keydown',function(e)
 {
  //if (e.keyCode==27) {}
  xhr.abort();
  console.log('escape, abort 1?');
 },false);

 xhr.addEventListener('keydown',function(e)
 {
  //if (e.keyCode==27) {}
  xhr.abort();
  console.log('escape, abort 2?');
 },false);
}

Answer 1

尝试将事件附加到window对象：

var xhr = new XMLHttpRequest();
// ...
window.addEventListener('keydown',function(e) {
    if (e.keyCode==27) {
        xhr.abort();
    }
}, false);

Answer 2

[七年后，我遇到了我的旧帖子，并决定尝试自己弄清楚。可以嵌入window事件监听器。相关的代码行在函数的底部，并且在Waterfox和Chrome中可以正常工作。

function ajax_promise(method,url)
{
 var xhr = new XMLHttpRequest();

 return new Promise(function (resolve, reject)
 {
  xhr.onabort = function()
  {
   alert('xhr aborted!');
  }

  xhr.onreadystatechange = function ()
  {
   if (xhr.readyState == 4)
   {
    if (xhr.status == 200) {resolve(xhr);}
    else {reject({status: xhr.status, statusText: xhr.statusText});}
   }
  };

  window.onkeydown = function(event) {if (event.key && event.key == 'Escape') {xhr.abort();}}
  xhr.open(method, url, true);
  xhr.send();
 });
}