Jquery, ajax () и each (), как ждать, пока вся информация действительно загружена?

Question

У меня есть функция, использующая $ .ajax () для получения значений из XML-файла, когда информация загружается и срабатывает событие успеха, я использую $ (xml) .find (''). Each (function (){});заполнить некоторые переменные ...

function getData()
{
    $.ajax({
        type: 'GET',
        url : 'info.xml',
        dataType: 'xml',
        success: function(xml)
        {
            $(xml).find('DATAS').each(function()
            {
                date = new Date($(this).attr('DATE'));
                alert(date);
            })
                    //Here I have a bigger find/each that should take more time 
        },
            error: function()
            {
                    return false;
            }

    }); 
}

В этом случае, когда я запускаю функцию из функции готовности документа, предупреждение показывает правильные данные, но если я удалю предупреждение из функции и попробую этовместо этого дата еще не будет определена:

$(document).ready(function()
{
if(getData() != false)
{
    alert(date);

    }
});

Я думаю, в этом случае данные еще не готовы?Есть ли способ сохранить контроль, когда весь обход каждого () закончен и готов?

Answer 1

.ajax() запускает асинхронный запрос, что означает, что getData() вернется немедленно. Вы должны выполнить все действия с возвращенными данными в обработчике успеха или установить синхронный запрос .ajax, добавив

$.ajax({
   async: false   
});

Answer 2

Это происходит потому, что AJAX является асинхронным, что означает, что вызов $.ajax() не завершается до тех пор, пока не завершится if() ... alert() в пути, который просто дает ему время для завершения , Вы должны запустить любую операцию, которая должна использовать данные из обратного вызова success, когда он запускается, данные становятся доступными. Примерно так:

$(function() {
  getDataAndDoSomething();
  //other ready stuff...
});
function getDataAndDoSomething() {
  $.ajax({
    type: 'GET',
    url : 'info.xml',
    dataType: 'xml',
    success: function(xml) {
        $(xml).find('DATAS').each(function() {
            date = new Date($(this).attr('DATE'));
            alert(date);
        })
        //Do the other stuff depending on the date data
    }
  }); 
}