Fonction JavaScript qui renvoie les données D'appel AJAX [dupliquer]

cette question a déjà une réponse ici:

  • Comment retourner la réponse d'un appel asynchrone? 33 réponses

je voudrais créer une fonction JavaScript qui renvoie la valeur d'un appel AJAX jQuery. Je voudrais quelque chose comme ça.

function checkUserIdExists(userid){
    return $.ajax({
        url: 'theurl',
        type: 'GET',
        cache: false,
        data: {
           userid: userid
        },
        success: function(data){
            return data;
        }
    });
}

je sais que je peux le faire en mettant async à false mais je ne préférerais pas.

20
demandé sur jmort253 2011-03-01 07:49:17

6 réponses

avec jQuery 1.5, vous pouvez utiliser la toute nouvelle fonction $.Deferred , qui est destinée à exactement cela.

// Assign handlers immediately after making the request,
// and remember the jqxhr object for this request
var jqxhr = $.ajax({ url: "example.php" })
    .success(function() { alert("success"); })
    .error(function() { alert("error"); })
    .complete(function() { alert("complete"); });

// perform other work here ...

// Set another completion function for the request above
jqxhr.complete(function(){ alert("second complete"); });

Source

6
répondu Matt Ball 2011-03-01 04:59:12

vous ne pouvez pas retourner les données retournées par un appel AJAX à moins que vous ne vouliez l'appeler de façon synchrone (et vous ne me faites pas confiance). Mais ce que vous pouvez retourner est un promesse d'une donnée retournée par un appel AJAX et vous pouvez le faire en fait d'une manière très élégante.

( mise à JOUR: S'il vous plaît noter que actuellement jQuery promesses ne sont pas compatibles avec le promesses / a + Spécification - plus d'informations dans ce réponse .)

Fondamentalement, vous pouvez retourner la valeur de retour de votre $.Ajax.(..) appel:

function checkUserIdExists(userid){
    return $.ajax({
        url: 'theurl',
        type: 'GET',
        cache: false,
        data: {
           userid: userid
        }
    });
}

et quelqu'un qui appelle votre fonction peut l'utiliser comme ceci:

checkUserIdExists(userid).success(function (data) {
    // do something with data
});

Voir ce post de la mine pour une meilleure explication et démos si vous êtes intéressé.

30
répondu rsp 2017-05-23 12:02:14

vous pouvez passer dans une fonction de rappel:

function checkUserIdExists(userid, callback) {
    $.ajax({
        ...
        success: callback
    });
}

checkUserIdExists(4, function(data) {

});
13
répondu Omer Bokhari 2011-03-01 04:56:59

à partir de jQuery 1.8, les callbacks" success"," error "et" complete " sont dépréciés. Au lieu de cela, vous devriez utiliser "fait", "échec" et "toujours".

donc vous auriez pu:

function checkUserIdExists(userid, callback) {
        return $.ajax({
        url: 'theurl',
        type: 'GET',
        cache: false,
        data: {
           userid: userid
        }
    })
    .done(callback)
    .fail(function(jqXHR, textStatus, errorThrown) {
        // Handle error
    });
}

checkUserIdExists(2, function(data) {
    console.log(data); // Do what you want with the data returned
});
7
répondu Michael Sharman 2012-06-20 01:55:38

ce N'est pas comme ça que la programmation asynchrone JavaScript devait être faite. Au lieu de cela, utilisez un callback dans votre fonction de succès pour appeler une autre fonction pour utiliser vos données retournées à partir du serveur.

3
répondu jmort253 2011-03-01 04:54:49

Tim, les deux scénarios sont mutuellement exclusifs; une opération asynchrone ne servira à rien et ne pourra pas non plus récupérer les données retournées.

vous devriez regarder une infrastructure event-enabled pour vos appels ajax

2
répondu Olaseni 2011-03-01 05:06:05