Question

我在document.addEventListener（'DOMContentLoaded'）之外有一个ajax请求，我想知道是否可以等待EventListener内部完成ajax请求（没有async：false）。

换句话说，在完全完成ajax请求之前，请勿在EventListener内部触发函数。

这是我的代码：

var a;
$.ajax({
    t: "GET",
    url: "file.php"
}).done(function(data){
    a = data;
});

document.addEventListener('DOMContentLoaded', function() {
    //Wait  for ajax request to complete
    someFunction(a);
});

Answer 1

您可以定义一个返回ajax承诺的函数，如下所示：

function myajax(){
    return $.ajax({
               t: "GET",
               url: "file.php"
           });
var promise = myajax();
document.addEventListener('DOMContentLoaded', function() {
    promise.done(function(data){ 
        //Some action
    }

Answer 2

在大多数情况下，您只是将ajax请求放入处理程序中，但是如果确实需要，可以使用事件发射器。

let eventEmitter = new EventTarget();
let data = null;

function getData() {
  // simulate ajax call
    setTimeout(function() {
      data = "some data"
      eventEmitter.dispatchEvent(new Event('complete'))
    }, 3000)
}

getData();

document.addEventListener('DOMContentLoaded', function() {
    //Wait  for ajax request to complete
    eventEmitter.addEventListener('complete', function() {
      // do something here
      console.log("Ajax request finished");
    })
});

等待在document.addEventListener（'DOMContentLoaded'）中完成的ajax

2 个答案: