jQuery: datele de Întoarcere după apel ajax succes

Am ceva de genul asta, unde e un simplu apel la un script care dă o valoare, un șir..

function testAjax() {
    $.ajax({
      url: "getvalue.php",  
      success: function(data) {
         return data; 
      }
   });
}

dar dacă aș suna ceva de genul asta

var output = testAjax(svar);  // output will be undefined...

deci, cum pot reveni la valoarea? codul de mai jos nu pare să fie locul de muncă...

function testAjax() {
    $.ajax({
      url: "getvalue.php",  
      success: function(data) {

      }
   });
   return data; 
}
Comentarii la întrebare (2)

Notă: Acest răspuns a fost scris în februarie 2010.
a se Vedea actualizări de la 2015, 2016 și 2017, în partea de jos.
Puteți't se întoarcă nimic dintr-o funcție care este asincron. Ce vă puteți întoarce este un promit. I-am explicat cum promisiuni de muncă în jQuery în răspunsurile mele la aceste întrebări:

function testAjax() {
  $.ajax({
    url: "getvalue.php",  
    success: function(data) {
      return data; 
    }
  });
}

puteți scrie testAjax funcție de genul asta:

function testAjax() {
  return $.ajax({
      url: "getvalue.php"
  });
}

Apoi poți să-ți promit așa:

var promise = testAjax();

Puteți stoca promit, puteți trece în jurul valorii de, puteți să-l utilizați ca un argument în funcția de apeluri și puteți reveni la funcții, dar când în cele din urmă vreau să utilizare datele dvs., care este returnat de apel AJAX, trebuie să o faci astfel:

promise.success(function (data) {
  alert(data);
});

(A se vedea actualizări de mai jos pentru sintaxă simplificată.) Dacă datele sunt disponibile la acest punct, atunci această funcție va fi apelată imediat. Dacă e't atunci acesta va fi invocat de îndată ce sunt disponibile date. Ideea de a face toate de acest lucru este faptul că datele dvs. nu este disponibilă imediat după apelul la $.ajax, pentru că este asincron. Promisiuni este o abstracție frumos de funcții pentru a spune: nu pot't returna datele pentru că eu nu't au o încă și nu't doriți să blocați și să vă așteptați deci, aici's a promit în loc și te'll fi capabil să-l folosească mai târziu, sau să-l dau la altcineva și să fie făcut cu ea. Vezi asta [DEMO](http://jsfiddle.net/jW68r/). UPDATE (2015)

În prezent (Martie, 2015) jQuery Promisiunile nu sunt compatibile cu Promisiuni/O+ caietul de sarcini ceea ce înseamnă că acestea nu pot coopera foarte bine cu alte Promisiuni/O+ conformă implementări. Cu toate acestea jQuery Promisiuni în versiunea viitoare 3.x vor fi compatibil cu Promisiuni/O+ caietul de sarcini (datorită Benjamin Gruenbaum pentru sugestie). În prezent (din luna Mai, 2015) versiunile stabile de jQuery sunt 1.x și 2.x.

Ceea ce am explicat mai sus (Martie, 2011) este o modalitate de a folosi jQuery Amânat Obiecte a face ceva în mod asincron că, în sincron cod-ar fi realizat prin returnarea unei valori. Dar un sincron apel de funcție pot face două lucruri - aceasta poate returna o valoare (dacă se poate) sau a arunca o excepție (dacă se poate't returneaza o valoare). Promisiuni/O+ adrese ambele cazuri de utilizare într-un mod care este destul de mult la fel de puternic ca excepție de manipulare în sincron cod. Versiunea jQuery mânere echivalentul a se întoarce o valoare bine dar echivalent de complex excepție de manipulare este oarecum problematică. În special, ideea de manipulare excepție în sincron cod nu este doar oferindu-up cu un mesaj frumos, dar încercarea de a rezolva problema și de a continua executarea, sau, eventual, rethrowing aceeași sau o altă excepție pentru alte părți de program pentru a gestiona. În sincron cod ai o stiva de apeluri. În apel asincron nu't și avansate de manipulare excepție în interiorul promite ca necesare prin Promisiuni/O+ caietul de sarcini poate ajuta cu adevărat să scrie cod care se va ocupa de erori și excepții într-un mod semnificativ chiar și pentru complexe cazuri de utilizare. Pentru diferențe între jQuery și alte implementări, și cum de a converti jQuery promisiuni Promisiuni/O+ compatibil, consultați Vine de la jQuery de Kris Smith et al. pe Q bibliotecă wiki și Promisiuni ajunge în JavaScript de Jake Archibald pe HTML5 Pietre.

Cum pentru a reveni un real promit

Funcția din exemplul meu de mai sus:

function testAjax() {
  return $.ajax({
      url: "getvalue.php"
  });
}

returnează un jqXHR obiect, care este un jQuery Amânat Obiect. A face să se întoarcă o promisiune reală, puteți schimba pentru a - folosind metoda de Q wiki:

function testAjax() {
  return Q($.ajax({
      url: "getvalue.php"
  }));
}

sau, folosind metoda de HTML5 Pietre articolul:

function testAjax() {
  return Promise.resolve($.ajax({
      url: "getvalue.php"
  }));
}

Această Promisiune.rezolva($.ajax(...))este, de asemenea, ceea ce este explicat înpromitmodulul documentația](https://github.com/then/promise#promiseresolvevalue) și ar trebui să funcționeze cu [ES6Promise.resolve()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/resolve). Pentru a utiliza ES6 Promite astăzi puteți folosi [es6-promit modul'spolyfill()`](https://github.com/jakearchibald/es6-promise#auto-polyfill) de Jake Archibald. Pentru a vedea în cazul în care puteți utiliza ES6 Promisiuni fără polyfill, a se vedea: Pot folosi: Promisiuni. Pentru mai multe informații a se vedea:

promise.success(function (data) {
  alert(data);
});

puteți scrie:

promise.success(data => alert(data));

sau folosind Promisiuni/O+ API:

promise.then(data => alert(data));

Amintiți-vă să folosiți întotdeauna respingere stivuitoare cu:

promise.then(data => alert(data), error => alert(error));

sau cu:

promise.then(data => alert(data)).catch(error => alert(error));

Vezi acest răspuns pentru a vedea de ce ar trebui să folosiți întotdeauna respingere stivuitoare cu promisiuni:

promise.then(data => alert("x is " + data.x));

Nu fiecare browser-ul acceptă această sintaxă încă, dar există anumite cazuri când're sigur de ceea ce browser-ul, codul va rula pe - de exemplu, atunci când scrieți un extensia Chrome, o Firefox Add-on, sau o aplicație desktop folosind Electron, NW.js sau AppJS (a se vedea acest answer pentru detalii). Pentru sprijin de săgeată funcții, consultați:

  • Există chiar o nouă sintaxă acum numit asincron funcții cu un nou așteaptă cheie care în loc de acest cod:
functionReturningPromise()
    .then(data => console.log('Data:', data))
    .catch(error => console.log('Error:', error));

vă permite să scrie:

try {
    let data = await functionReturningPromise();
    console.log('Data:', data);
} catch (error) {
    console.log('Error:', error);
}

Puteți folosi numai în interiorul unei funcții creat cu cheie "asincron". Pentru mai multe informații, a se vedea:

Comentarii (9)
Soluția

Singura modalitate de a reveni la datele din funcție ar fi să facă un sincron de apel în loc de un apel asincron, dar care ar îngheța în sus browser-ul în timp ce-l's de așteptare pentru un răspuns.

Puteți trece într-o funcție de apel invers, care se ocupă de rezultat:

function testAjax(handleData) {
  $.ajax({
    url:"getvalue.php",  
    success:function(data) {
      handleData(data); 
    }
  });
}

Suna așa:

testAjax(function(output){
  // here you use the output
});
// Note: the call won't wait for the result,
// so it will continue with the code here while waiting.
Comentarii (7)

puteți adăuga asincron opțiune pentru fals și reveni în afara apel ajax.

function testAjax() {
    var result="";
    $.ajax({
      url:"getvalue.php",
      async: false,  
      success:function(data) {
         result = data; 
      }
   });
   return result;
}
Comentarii (7)

Idk dacă ați rezolvat-o, dar eu recomand un alt mod de a face, și funcționează :)

    ServiceUtil = ig.Class.extend({
        base_url : 'someurl',

        sendRequest: function(request)
        {
            var url = this.base_url + request;
            var requestVar = new XMLHttpRequest();
            dataGet = false;

            $.ajax({
                url: url,
                async: false,
                type: "get",
                success: function(data){
                    ServiceUtil.objDataReturned = data;
                }
            });
            return ServiceUtil.objDataReturned;                
        }
    })

Deci ideea principală aici este că, prin adăugarea asincron: fals, atunci voi face tot ce-așteaptă până când datele sunt preluate. Apoi atribuiți-l la o variabilă statică a clasei, și totul magic funcționează :)

Comentarii (1)

Vezi jquery docs exemplu: http://api.jquery.com/jQuery.ajax/ (aproximativ 2/3 din pagină)

Ați putea fi în căutarea pentru următorul cod:

    $.ajax({
     url: 'ajax/test.html',
     success: function(data) {
     $('.result').html(data);
     alert('Load was performed.');
   }
});

Aceeași pagină...mai jos.

Comentarii (0)