1

好的，所以我有一个使用 jQuery 的 do-while 循环。基本上它的重点是检查目录中是否有照片并将其添加到数组中。该目录的照片都命名为“phone01.png”、“phone02.png”等，它们位于一个名为“slides”的目录中。

这是代码：

var images = [];
var i=0;

    do {
        ++i;
        $.get('./slides/phone0' + i + '.png',function(){
            images[(i-1)] = './slides/phone0' + i + '.png';
        });
    }
    while ( images[(i-1)] == './slides/phone0' + i + '.png' );

所以如果我最后使用控制台，images[] 只包含'./slides/phone01.png'，但是

我是 1

images[(i-1)] 因此是 './slides/phone0' + i + '.png'

输入( images[(i-1)] == './slides/phone0' + i + '.png' )退货true。所以 while 语句为真，但循环没有继续。

此外，如果我再次手动运行循环（迭代 i，运行 get），get 将成功并将新成员添加到数组中。所以，do 函数永远不会运行第二次。

是什么赋予了？

4

3 回答 3

3

$.get 是一个异步请求。因此，您的循环将始终运行一次，因为图像数组永远不会按您的预期设置。

于 2012-10-22T20:09:53.150 回答
1

这是一个经典的异步问题。

当你调用时$.get()，它不会立即进入你给它的函数。

发生的情况是它设置了一个 HTTP 请求，并将该函数附加到请求中，作为请求成功时调用的函数。

然后程序的原始部分继续自己的业务，忘记了 HTTP 请求和它传递给它的函数。

在这种情况下，程序的原始部分是while循环。一旦它放弃了它的功能，它就会继续并围绕while循环循环。

在循环的每次迭代中创建的函数不会被触发，直到 (a) HTTP 请求有一个成功的响应，并且 (b) 正在运行的其余 Javascript 代码停止阻塞线程并让它有机会运行.

这称为异步代码，并且是第一个“A”术语“AJAX”。这也是整个 Javascript 事件处理模型的工作原理，以及您在 jQuery 中看到的所有嵌套函数。（这也可以解释您可能已经看到代码似乎以错误顺序运行的其他情况）。

如果你想用异步代码做这样的循环，你需要用完全不同的方式编写它：while你编写的传统循环将无法工作。

有很多方法可以做到，但我建议不要只是给你一些代码，而是更多地挖掘整个事情是如何工作的，因为如果你要编写 Ajax 代码，你需要了解这些东西.

不过我会给你一个提示：全局变量在这类程序中通常不是那么有用。从您的代码示例中不清楚您的变量是否是全局变量，但如果是，您肯定要考虑将它们设为局部变量并在函数之间传递它们，而不是仅仅期望将它们设置在一个地方并为它们设置在另一个工作。

希望有帮助。

于 2012-10-22T20:18:30.623 回答
1

首先，我对立即调用函数表达式的工作原理有一个非常薄弱的​​掌握，我尝试了这个：

var i=0;

do {
    ++i;
    (function(iteration){
        $.get('./slides/phone0' + i + '.png',function(){
            images[(i-1)] = './slides/phone0' + i + '.png';
        });
    })(i);
}
while ( images[(i-1)] == './slides/phone0' + i + '.png' );

尝试在 while 循环中强制评估 GET ......无济于事。我已经解决了以下问题。欢迎任何关于这是多么有效/干净的想法。我可能从 C 的角度思考太多（函数中的函数！-- 在此处插入 Xzibit meme）。但这确实完成了工作：

var i=0;

function createArray(){
    $.get('./slides/text0' + (i+1) + '.txt',function(data){
        texts.push(data);
    });
    $.get('./slides/phone0' + (i+1) + '.png',function(){
        images[i] = new Image();
        images[i].src = './slides/phone0' + (i+1) + '.png';
        i++;
        createArray();
    }).error(function(){
        slider();
    });
}
于 2012-10-24T06:35:19.267 回答