Funktion zum Abrufen von Wert aus AJAX-Anforderung

Question

Wie schreiben Sie eine Funktion, die einen Wert vom Server über $.get abgerufen zurückgibt?

Dies ist, was ich versucht habe, die nicht funktioniert:

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

Irgendwelche Ideen?

Answer 1

Da Ajax-Anfragen asynchron sind. Aus diesem Grund müssen Sie einen Rückruf an $.get übergeben, um die Daten zu behandeln, sobald es verfügbar ist. Aber die getMessage Funktion kehrt zurück, bevor der Rückruf $.get ausgeführt wird.
Sie müssen einen Callback übergeben, der etwas mit dem Rückgabewert tut. ZB:

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

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

Natürlich können Sie auch die Datenextraktion passieren kann dort die callack direkt an $.get und Griff:

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

Answer 2

Es gibt zwei Möglichkeiten, dies zu handhaben: Verwenden Sie einen synchronen Aufruf über $.ajax oder übergeben Sie einen Callback an Ihre Funktion, anstatt einen Wert zurückgeben zu lassen. Letzteres ist die kanonische Art, mit AJAX umzugehen, da es den asynchronen Charakter des Aufrufs beibehält.

Asynchronous

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

Synchrone - versuchen Sie nicht, es auf diese Weise zu tun, da Sie Ihren Browser sperren werde, bis es fertig ist.

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

Hinweis: Diese sind nicht getestet.