jQuery暂停数组循环，直到准备就绪

Question

嘿，我是新的jquery，我希望我的标题有意义：p。我需要在此循环中暂停，直到阵列中的上一个iframe准备就绪，然后下一步获得SRC。这是我的一些代码，我认为它相当接近，但我缺少一些。

enter code here
var url = [
    "http://www.stuff.co.nz/" ,
    "http://www.metservice.com/marine-surf/tides/nelson"
];
$(function()
{
    $("iframe").each(function(index)
    {
        if (index == 0)
        {
            $(this).attr('src', url[index]);
        }
        $(this).ready()
        {
            $(this).attr('src', url[index]);
        }
    });
});

Answer 1

您必须等待iframe的加载事件，然后触发下一个迭代，在每个（）循环中都无法轻松地进行操作，因此似乎使用重复的功能似乎更好的

var url = [
    "http://www.stuff.co.nz/",
    "http://www.metservice.com/marine-surf/tides/nelson"
];
$(function () {
    var iframes = $("iframe"),
        i = 0,
        l = iframes.length;
    (function fn(elem) {
        elem.load(function() {
            if (i<l) {
                fn( iframes.eq( elem.index(iframes) + 1 ) );
            }
        }).prop('src', url[i++]);
    })(iframes.first());
});

小提琴

Answer 2

尝试此代码..

$(function() {
   var totalFrames = $("iframe").length;
   function setURL ( index ) {
      $("iframe:eq("+index+")").attr('src', url[index]);
      $("iframe:eq("+index+")").load(function () {
         alert('iframe loaded');
         if ( index < totalFrames ) {
            setURL( index );
         } 
      });
   }
   setURL ( 0 ); 
});

Answer 3

尝试以下：

    function loadFrames(index)
    {
         if(index>=$("iframe").length)
            return;
         $("iframe").eq(index).attr('src', url[index]);
         $("iframe").eq(index).load(){
           loadFrames(index++);
         }
    }
    $(function(){
      loadFrames(0);
    });