2

好的，所以这个标题可能不能很好地解释我的问题。希望这是有道理的。这也是我第一个使用 jQuery 的应用程序，如果我在做一些愚蠢的事情，请原谅我。

我有以下功能：

function getRandomImages(limit) {
    imagesArray = new Array();
    $.getJSON('createImageArray.php', {limit: limit}, function(data) {
        $.each(data, function(i) {
            imagesArray[i] = data[i];  //imagesArray is declared globally.
        });
    }); 
}

getJSON 正确地抓取了 JSON 对象。它返回如下内容：

{"image0":"images/19.10.FBB9.jpg","image1":"images/8.16.94070.jpg","image2":"images/8.14.47683.jpg","image3":"images/8.15.99404.jpg","image4":"images/8.13.20680.jpg","image5":"images/21.12.9A.jpg","image6":"images/8.17.75303.jpg"}

我正在调试并且确信 data[i] 正确包含从 JSON 对象中获取的图像路径。但是，在调用 getRandomImages() 之后，我查看了我的全局 imagesArray 并注意到没有任何更改。我猜它正在创建 imagesArray 的副本，而不是获取实际的副本。

有人能告诉我我需要做什么才能让我的全局 imagesArray 在 $.each 块中更新吗？我需要以某种方式通过引用传入 imagesArray 吗？对不起，我有点迷路了。

谢谢您的帮助。

编辑：一些背景信息。我正在从数据库中填充一组随机图像位置。我不想一次将数据库中的所有图像加载到数组中，因为太多了。所以，我有一个计数器来跟踪我在图像阵列中的位置。处理完一张图片后，我将指针移至下一张图片。如果我到达终点，我需要抓取更多随机图像。这就是调用上述 js 函数的地方；它调用 createImageArray.php 从数据库中获取 x 个随机图像并返回一个数组。然后我想将这些图像位置存储在我的全局 imagesArray 中。

我不确定如何重构我的代码以考虑 .getJSON 的异步特性。

4

5 回答 5

5

这里发生的getJSON是异步调用的。因此该函数立即返回，并在稍后的某个时间调用其中的代码。只有到那时才会更新 imagesArray。

您可以让 getJSON 同步运行，但我不建议这样做。相反，我建议重组代码以考虑 AJAX 请求的异步性质。

编辑：要发出同步请求，请使用async选项（链接）。使用通用$.ajax函数或设置 AJAX 全局选项。我不推荐这样做的原因是它锁定了浏览器。如果您的服务器未能及时响应，用户将无法使用他/她的浏览器。

重构代码并不难。只需在回调函数中移动处理图像数组的逻辑即可。例如，而不是：

function getRandomImages(limit) {
    imagesArray = new Array();
    $.getJSON('createImageArray.php', {limit: limit}, function(data) {
        $.each(data, function(i) {
                imagesArray[i] = data[i];  //imagesArray is declared globally.
        });
    }); 
   processImages();
}

做

function getRandomImages(limit) {
    imagesArray = new Array();
    $.getJSON('createImageArray.php', {limit: limit}, function(data) {
        $.each(data, function(i) {
                imagesArray[i] = data[i];  //imagesArray is declared globally.
        });
        processImages();
    }); 
}
于 2009-02-18T09:05:44.923 回答
2

好吧，我第一次没有理解这个问题。这有点骇人听闻，但在不了解您的代码的情况下，我会在您创建 imagesArray 时创建一个 bool imagesLoaded。

function getRandomImages(limit) {
    imagesArray = new Array();
    imagesLoaded = false;
    $.getJSON('createImageArray.php', {limit: limit}, function(data) {
        $.each(data, function(i) {
                imagesArray[i] = data[i];  //imagesArray is declared globally.
        });
        imagesLoaded = true;
    }); 
}

然后，在调用 getRandomImages() 之后，将代码放入带有 setTimeout() 的保持模式，直到 imagesLoaded = true。哦，也许在页面上放一些加载图形供用户查看，这样他们就不会认为你的应用程序被破坏了。

于 2009-02-18T17:08:30.440 回答
0

试试这个：

function getRandomImages(limit) {
    imagesArray = new Array();
    $.getJSON('createImageArray.php', {limit: limit}, function(data) {
        $.each(data, function(i, val) {
                imagesArray[i] = val;  //imagesArray is declared globally.
        });
    }); 
}
于 2009-02-18T09:06:06.390 回答
0

首先：为什么要使用全局变量？这是个坏主意，不要这样做。您可以在给定命名空间内的函数之间共享变量，如下所示：

var NAMESPACE = {};
NAMESPACE.example = function() { 

    var myField = '1';

    return { 

        someMethod: function() { 
             return myField;
        }, 

        anotherMethod: function() { 
            return myField;
        } 
    };
}();

其次，拿到数组后怎么办？你想在页面上显示图像还是什么？您可以将 img-elements 放在页面上而不是将它们放入数组中吗？

于 2009-02-18T15:56:12.423 回答
-1

也许这项工作对我有用.. :)

$variable= new array();

$.getJSON("url", function(data){
asignVariable(data);
}

function asignVariable(data){
$variable = data;
}

console.log($variable);

希望对你有帮助.. :)

于 2012-02-01T16:11:02.673 回答