jQuery ajax调用变量

Question

对于我的Phonegap / Cordova项目，我尝试使用以下功能来处理所有ajax调用：

function requestData(action, id ) {
    var data = {
        user_id: localStorage.getItem('user_id')
    };
    if( action == 'feed_load_feedings' || action == 'feed_add_load_menu_weight' || action == 'feed_add_load_menu_supps' ) {
        data.id = id;
    }
    $.ajax({
        type: 'post',
        url: 'http://_______.com/file.php?'+action,
        async: false,
        crossDomain: true,
        data: data,
        beforeSend: showLoader,
        error: handleError,
        success: handleSuccess
    });
}
function showLoader() {
    console.log('showLoader fired')
    $('body').prepend('<p id="loading">De gegevens worden geladen...</p>');
}
function handleError(data) {
    console.log('handleError fired')
    $('#loading').remove();
    $('body').prepend('<p id="error">Fout tijdens het laden van de gegevens...</p>');
    return false;
}
function handleSuccess(data) {
    console.log('handleSuccess fired')
    $('#loading').remove();
    if( typeof data !== 'object' ) {
        $('body').prepend('<p id="error">Fout in gegevens object...</p>');
        return false;
    }
    else if(data.length == 0 ) {
        return 0;
    }
    else {
        return data;
    }
}

这样既可以处理请求，也可以处理错误。

如果一切正常，则应返回数据。 但是使用此：

$(function() {
    var herd = requestData('herd_load_herds');
    console.log(herd):
});

在控制台中给出以下内容：

showLoader fired
POST http://_______.com/file.php?feed_load_feedings
handleSuccess fired
undefined

在POST请求中，我可以看到该数据已被调用并且可以。 但是，它没有放入变量中。 我认为向我的ajax调用添加async: false可以防止这种情况。 我要监督什么？

Answer 1

返回undefined的原因非常明显，因为requestData函数不返回任何内容，这意味着它间接返回undefined

Ajax的流程是异步的，因此在函数requestData返回任何内容requestData无效。 您需要在函数调用中传递回调函数，并在成功/错误处理程序中执行它。

$(function() {
    requestData('herd_load_herds', 'someid', function(err, data){
      if(err){
        console.log("error");
        console.log(err);
      }else{
        console.log("success");
        console.log(data):
      }
    });    
});

在AJAX中：

function requestData(action, id, callback) {
    var data = {
        user_id: localStorage.getItem('user_id')
    };
    if( action == 'feed_load_feedings' || action == 'feed_add_load_menu_weight' || action == 'feed_add_load_menu_supps' ) {
        data.id = id;
    } 
    $.ajax({
            type: 'post',
            url: 'http://_______.com/file.php?'+action,
            async: false,
            crossDomain: true,
            data: data,
            beforeSend: showLoader,
            error: function(error){
              handleError(error, callback);
            },
            success: function(data){
              handleSuccess(data, callback);
            }
        });
}

在处理程序中：

function handleSuccess(data, next) {
    console.log('handleSuccess fired')
    $('#loading').remove();
    if( typeof data !== 'object' ) {
        $('body').prepend('<p id="error">Fout in gegevens object...</p>');
        next(undefined, false);
    }else{       
      next(undefined, data);
    }
}

function handleError(err, next) {
    console.log('handleError fired')
    $('#loading').remove();
    $('body').prepend('<p id="error">Fout tijdens het laden van de gegevens...</p>');
    next(err);
}

Answer 2

您的代码运行正常。 默认情况下，没有返回值的JavaScript函数返回undefined 。 您的函数requestData没有return <someValue>语句，因此返回默认的undefined 。

如果要保存数据，则需要将其保存在success回调中。

我的建议是不要尝试使用async: false破解。 只需执行所有异步操作并适当地响应回调即可。