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();
 });
}

按escape键中止AJAX文件上传

2 个答案: