Функция для получения значения из запроса AJAX

Question

Как написать функцию, которая возвращает значение, полученное с сервера через $.get?

Это то, что я пробовал, но это не работает:

function getMessage(key) {
    $.get("/messages.json", function(data) {
        return data.messages[key];
    }, "json");
}

Есть идеи?

Answer 1

Поскольку запросы Ajax асинхронны . Вот почему вы должны передать обратный вызов $.get, чтобы обработать данные , как только они станут доступны . Но функция getMessage возвращается до выполнения обратного вызова $.get.
Вы должны передать обратный вызов, который делает что-то с возвращаемым значением. E.g.:

function getMessage(key, cb) {
  $.get("/messages.json", function(data) {
    cb(data.messages[key]);
  }, "json");
}

getMessage('foo', function(data) {
    alert(data);
});

Конечно, вы также можете передать вызов непосредственно в $.get и обработать извлечение данных там:

function getMessage(cb) {
  $.get("/messages.json", cb);
}

Answer 2

Есть два способа справиться с этим: использовать синхронный вызов через $.ajax или передать обратный вызов вашей функции вместо того, чтобы она возвращала значение. Последний является каноническим способом работы с AJAX, поскольку он сохраняет асинхронный характер вызова.

Асинхронный

function processMessage(key,elem,cb) {
     $.get('/messages.json', function(data) {
           if (cb && typeof(cb) === 'function') {
               cb.apply(elem,data.messages[key]);
           }
     }
}


$('.something').each( function() {
      processMessage('somekey', this, function(msg) {
            $(this).append(msg);
      });
});

Синхронный - постарайтесь не делать этого таким образом, так как вы заблокируете свой браузер, пока это не будет сделано.

function getMessage(key)
{
   var result = '';
   $.ajax({
       url: '/messages.json',
       aSync: false,
       type: 'get',
       dataType: 'json',
       success: function(data) {
                     result = data.messages[key];
                }
   });
   return result;
}

$('.something').each( function() {
    var msg = getMessage('somekey');
    $(this).append(msg);
});

Примечание: они не проверены.