检查ajax调用是否完成

Check for ajax call completion

本文关键字:是否 调用 ajax 检查      更新时间:2023-09-26

我有一个问题填充和访问一个全局变量与ajax。我有以下代码(稍微简化一下):

var answers;
$(document).ready(function() {
   showResults();
   console.log(answers);
}
function showResults(){
    $.ajax({
        url: "/wp-content/themes/hoekiesikeenschool/question-storage.php",
        data: { action: "get_results" },
        type: "post",
        dataType: "json"
    }).done(function (data) {
        answers = data.questionary; 
        return answers;
    }); 
}

我的问题如下:当我在done函数中记录answers时,它给了我一个很好的数组。这意味着array变量被填满了。但是当我从$(document).ready记录它时,它返回一个空变量。这可能是因为AJAX调用是异步的,并且日志在变量被填充之前执行。

然而,我需要在另一个页面上使用该变量,所以我需要从$(document).ready…关于如何检查变量是否填充的想法?或者当showResults()完成时?提前感谢您的帮助!

  • 编辑-

谢谢你的回复!但我仍然在努力解决以下问题:据我所知,我可以从ajax回调调用另一个函数,并将数据传递给它。事情是,我必须做很多不同的东西与它调用后,唯一的方法我可以让它工作现在是通过调用一个函数在ajax回调,然后从那个调用另一个,等等…

所以我最终在doc.ready中使用showResults();,然后执行许多都"链接"在一起的函数。无论如何,我可以返回数据到变量,在其他地方使用?我希望我已经说清楚了,英语不是我的母语,对不起。

在AJAX调用之后执行依赖于answers数组的功能。从done(..)

内部调用函数

一个非常粗略的想法:

var answers;
function functionalityDependentOnAnswers() {
   //the code dependent on answers array.
}
$(document).ready(function() {
   showResults();
   //Move code here to functionalityDependentOnAnswers()
}
function showResults(){
    $.ajax({
        url: "/wp-content/themes/hoekiesikeenschool/question-storage.php",
        data: { action: "get_results" },
        type: "post",
        dataType: "json"
    }).done(function (data) {
        answers = data.questionary; 
        functionalityDependentOnAnswer();
    }); 
}

您可以使用jQuery提供的when方法(查看这个SO链接)。

检查文档是否成功:这只会在成功回调完成时执行。

var answers;
$(document).ready(function() {
   showResults();
}
function showResults(){
    $.ajax({
        url: "/wp-content/themes/hoekiesikeenschool/question-storage.php",
        data: { action: "get_results" },
        type: "post",
        dataType: "json"
    }).when(function (data) {
       console.log(answers);
        answers = data.questionary; 
        return answers;
    }); 
}

想法:有一个隐藏的输入字段,并添加更改侦听器。

<input type="hidden" id="answerswers_input" />

现在有一个监听器。

var answers;
$(document).ready(function() {
    $('#answers_input').on('change', function() {
     // trigger your custom code
     console.log(answers);
    })
   showResults();
   console.log(answers);
}
function showResults(){
    $.ajax({
        url: "/wp-content/themes/hoekiesikeenschool/question-storage.php",
        data: { action: "get_results" },
        type: "post",
        dataType: "json"
    }).done(function (data) {
        answers = data.questionary; 
        $('#answers_input').val(answers);
    }); 
}

解决方案有点像一个hack,让我知道如果这对你有用

你走对了。

在DOM回调中处理答案。

var answers;
$(document).ready(function() {
   showResults();
}
function showResults(){
    $.ajax({
        url: "/wp-content/themes/hoekiesikeenschool/question-storage.php",
        data: { action: "get_results" },
        type: "post",
        dataType: "json"
    }).done(function (data) {
        answers = data.questionary;
        console.log(answers);
        // Manage answers here
    }); 
}