jQuery中的阿贾克斯方法，任何地方，但函数本身不能使用返回的数据(Can't use r

而是在这奇怪的问题，我不能用数据变量（由AJAX调用返回的信息）的任何地方，但在阿贾克斯功能本身。

我相信这是一个范围问题，但它是一个超越我，将不胜感激任何指针。

$('img#test').live('click', function(e) {
    e.preventDefault();
    var test = getPreviewImage();
    alert(test); // This just gives undefined
});


function getPreviewImage()
{
  var output;

  var img_bg = $('div#preview-1 img:nth-child(1)').prop('src');
  var img_fg = $('div#preview-1 img:nth-child(2)').prop('src');


  $.ajax({
    url: "/blah.php?v=12345,

  }).done(function (data) {

    alert(data); // This gives the correct response
    output = data; // This should take the data value but still be in scope for the return statement below

  });

return output;
}

Answer 1:

这不是真正的范围，但同步的问题。

当你的getPreviewImage函数返回时，Ajax调用尚未进行（这是异步和执行流程不等待请求和响应是完整的），所以output仍然是零。

您可以通过同步Ajax调用，或者通过提供一个回调来解决这个getPreviewImage ，而不是使用它的返回值。

为了使同步Ajax调用，通过false的async参数。 请参阅该文档 。

使用回调，你可以这样做：

$('img#test').live('click', function(e) {
    e.preventDefault();
    getPreviewImage(function(test){
        // use test
    });
});


function getPreviewImage(callback) {

  $.ajax({
    url: "/blah.php?v=12345",...

  }).done(function (data) {
    callback(data);
  });
}

使用同步调用更容易（你只需要一个参数设置为false），但回调的逻辑一般是优选的，因为它不会阻止你的脚本，并允许并行请求。

Answer 2:

您可以使用调用另一个函数$.ajax jQuery的功能。 试着做以下。

function getPreviewImage()
{
  var output;

  var img_bg = $('div#preview-1 img:nth-child(1)').prop('src');
  var img_fg = $('div#preview-1 img:nth-child(2)').prop('src');


  $.ajax({
    url: "/blah.php?v=12345,

  }).done(someotherFunction)

  });

}

function someotherFunction(data) {
     return data;
}

文章来源: Can't use returned data in .ajax method of jQuery anywhere but the function itself