Javascript 按escape键中止AJAX文件上载

Javascript 按escape键中止AJAX文件上载,javascript,ajax,file-upload,abort,Javascript,Ajax,File Upload,Abort,我正在尝试abort()AJAX文件上传。我已经尝试添加事件侦听器,并尝试对任何按键执行中止(),尽管我在控制台中没有看到任何内容。这必须在没有任何框架的情况下完成 function myFunction() { var xhr = new XMLHttpRequest(); xhr.upload.addEventListener('keydown',function(e) { //if (e.keyCode==27) {} xhr.abort(); console.log(

我正在尝试
abort()
AJAX文件上传。我已经尝试添加事件侦听器,并尝试对任何
按键
执行
中止()
,尽管我在控制台中没有看到任何内容。这必须在没有任何框架的情况下完成

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

尝试将事件附加到
窗口
对象:

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

尝试将事件附加到
窗口
对象:

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

七年后,我偶然发现了我的旧帖子,并决定自己尝试解决它。可以嵌入
窗口
事件监听器;相关代码行位于函数的底部,在Waterbox和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();
 });
}

七年后,我偶然发现了我的旧帖子,并决定自己尝试解决它。可以嵌入
窗口
事件监听器;相关代码行位于函数的底部,在Waterbox和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();
 });
}

XMLHttpRequest
没有一个名为
addEventListener
的方法,用于(新XMLHttpRequest()中的i){console.log('new XMLHttpRequest().+i);}
touché,埋在MDN的底部。让我再试一次-
XMLHTTpRequest
当前仅发出事件
readystatechange
-它不发出
keydown
或任何其他事件,因此不会触发绑定到这些事件的回调。使用antyrat发布的答案。你还在使用这个ajax文件上传程序吗?你真的像你之前说的那样为客户付费吗?我无法想象一个付费客户会因为已经编写的无数实用程序中存在的功能而成为这个病人。
XMLHttpRequest
没有一个名为
addEventListener
的方法(我在new XMLHttpRequest()){console.log('new XMLHttpRequest().+I)}
touché,埋在MDN的底部。让我再试一次-
XMLHTTpRequest
当前仅发出事件
readystatechange
-它不发出
keydown
或任何其他事件,因此不会触发绑定到这些事件的回调。使用antyrat发布的答案。你还在使用这个ajax文件上传程序吗?你真的像你之前说的那样为客户付费吗?我无法想象一个付费客户会因为已经编写的无数实用程序中存在的功能而成为患者。这已经在一个函数中,因此我必须创建一个全局变量,然后使用一系列请求实现整个系统,或者将功能移出函数,这是我的设置无法完成的。为什么全局变量?此
xhr
将进入关闭状态,如果在
xhr
变量准备就绪后初始化addEventListener,则一切都应正常工作。要使
窗口
事件侦听器正常工作,
xhr
对象还必须是未在函数内部定义的全局变量。@John-这是错误的。JavaScript是词汇范围的。它不需要是全球性的。看看这把小提琴:它已经在一个函数中了,所以我必须创建一个全局变量,然后用一系列请求实现整个系统,或者将功能移出函数,这是我的设置无法完成的。为什么是全局变量?此
xhr
将进入关闭状态,如果在
xhr
变量准备就绪后初始化addEventListener,则一切都应正常工作。要使
窗口
事件侦听器正常工作,
xhr
对象还必须是未在函数内部定义的全局变量。@John-这是错误的。JavaScript是词汇范围的。它不需要是全球性的。看看这把小提琴: