Retorno $ .get dados em uma função usando jQuery

Question

Eu estou tentando chamar uma função que contém o código jQuery. Eu quero esta função para retornar os resultados da instrução jQuery. Ele não está funcionando, e eu estou tentando descobrir o porquê.

function showGetResult (name) {
    var scriptURL = "somefile.php?name=" + name;
    return $.get(scriptURL, {}, function(data) { return data; });
}

alert (showGetResult("John"));

O alerta exibe "[object XMLHttpRequest]." No entanto, se eu executar a instrução jQuery, por si só, fora de uma função, ele funciona bem -> $.get(scriptURL, {}, function(data) { alert(data); })

Eu gostaria de ser capaz de re-utilizar este código, colocando-o dentro de uma função que retorna os dados $.get. O erro fundamental que eu estou fazendo aqui?

Answer 1

Você tem alguns erros diferentes. Em primeiro lugar, $ .get não devolver o valor de retorno da função de retorno. Ele retorna o objeto XHR. Em segundo lugar, a função get não é síncrono, é assíncrona tão showGetResult provavelmente irá retornar antes de obter concluída. Em terceiro lugar, você não pode retornar algo de dentro da chamada de retorno para o escopo externo. Você pode, no entanto, vincular uma variável no escopo externo e configurá-lo no retorno de chamada.

Para obter a funcionalidade que você quer, você vai precisar usar $ .ajax e defina a opção async como false. Em seguida, você pode definir uma variável no escopo externo e atribuí-lo no retorno de chamada ajax, retornando esta variável da função.

function showGetResult( name )
{
     var result = null;
     var scriptUrl = "somefile.php?name=" + name;
     $.ajax({
        url: scriptUrl,
        type: 'get',
        dataType: 'html',
        async: false,
        success: function(data) {
            result = data;
        } 
     });
     return result;
}

Você provavelmente seria melhor servido, no entanto, descobrir como fazer o que quiser na função de retorno em si, em vez de mudar de assíncrona para chamadas síncronas.

Answer 2

O erro fundamental que você está fazendo é que a chamada AJAX é feita de forma assíncrona, por isso, o tempo que você voltar, o resultado ainda não está pronto. Para fazer este trabalho, você poderia modificar seu código como este:

$(function() {
    showGetResult('John');
});

function showGetResult (name) {
    $.get('somefile.php', { 
        // Pass the name parameter in the data hash so that it gets properly
        // url encoded instead of concatenating it to the url.
        name: name 
    }, function(data) { 
        alert(data); 
    });
}

Answer 3

Parece que você quer solicitação síncrona: Como posso obter jQuery para executar um pedido Ajax síncrona, em vez de assíncrona,?

Ou, você pode querer passar callback para a sua função:

function showGetResult (name, callback) {
  var scriptURL = "somefile.php?name=" + name;
  return $.get(scriptURL, {}, callback);
}

showGetResult("John", function(data){ alert(data); });

Answer 4

O erro fundamental é a parte "assíncrona" de AJAX. Porque você não sabe quanto tempo o servidor terá de enviar de volta uma resposta, métodos AJAX não "bloquear" - isto é, você não chamar para o servidor e apenas sentar lá esperando o resultado. Em vez disso, você vai para outra coisa, mas você configurar um método, chamado de "retorno", que será acionado quando os resultados voltar. Este método é responsável por fazer o que precisa ser feito com os dados (por exemplo, injetando-lo na página).

Answer 5

Esta é a maneira errada de fazer. A função (de dados) é uma função chamada de volta por isso sempre que retornar $ .get irá executar .. há possibilidade de que a função chamada de volta não teria sido chamado.

Melhor você chamar seus dados post obter a função de função de método (dados).

Answer 6

Uma maneira eficiente é usar o método diferido do jQuery, tanto sync / async solicitações ao servidor e aguardar deferred.resolve () e, em seguida, retornar o objeto promessa adiada. Parece um tedioso pouco, mas um pouco de estudo é a certeza útil para dados grandes. (Função de tvanfosson funciona bem neste caso, mas quando eu estava trabalhando em dados do Google Analytics, uma grande quantidade de informações fez-me louco e, portanto, eu preciso encontrar esta solução)

     function showResults(name) { 
        var deferred = $.Deferred, requests = [];

        requests.push($.ajax({url:"/path/to/uri/?name=" + name, type: "GET", async: false}).done(function(d) { 
         //alert or process the results as you wish 
        }));
        $.when.apply(undefined, requests).then(function() { deferred.resolve(); }); 
        return deferred.promise();

    }

o objecto devolvido pode também promessa ser usado com $.when(showResults('benjamin')).done(function() { }); para modificações pós (como gráfico / gráfico configurações etc). totalmente reutilizável. Você também pode colocar esta função em um loop de US $ .deferred pedidos gosta,

        function updateResults() { 
             var deferred = $.Deferred, requests = [];
             requests.push($.ajax(url:"/path/to/names/?nameArr=" + jsonArrOfNames, type: "GET", async: false}).done(function(res) {  requests.push(showResults(res[0]));}) );
             $.when.apply($, requests).then(function() { deferred.resolve(); }); 
             return deferred.promise();
            }