加載一個iframe中的一組一個接一個網頁

我想在當前請求完成加載下一一組一個接一個的網頁，和負載，加載一個iframe中的一組一個接一個網頁

現在在我的示例頁面，我只有一個iframe中，

<iframe onload="loadNext()"></iframe>

我使用下面的腳本來完成這項工作，

var i = 0; 

    function loadNext() 
    { 
     var urls = [ 
     'http://localhost/a.htm', 
     'http://localhost/b.htm', 
     'http://localhost/c.htm', 
     ]; 

     if (i > urls.length - 1) 
     { 
      console.log ("Done!"); 
      return; 
     } 

     document.querySelector('iframe').src = urls[i ++]; 
    }

但onload事件被觸發太快了，我期望看到的3頁按順序加載，但它不是（從鉻瀏覽器中的Network選項卡），我甚至沒有看到nginx中的訪問日誌。

任何想法，爲什麼它不工作？

來源

2013-04-27 daisy

那麼會發生什麼？頁面加載但按不同的順序？ – zeroflagL 2013-04-27 10:57:54

@zeroflagL看起來並不真的「等待」當前的加載進度，只是立即跳到下一頁 – daisy 2013-04-27 11:03:02

但是'loadNext（）'被調用四次，最後一次調用打印「完成」？或者，那也不行？ – zeroflagL 2013-04-27 11:12:01

你的代碼應該可以工作。我已經測試過這個，並且在每個幀加載之前還添加了一個timeout，以便您可以看到更改。

var URLs = [ 
    'http://localhost/a.htm', 
    'http://localhost/b.htm', 
    'http://localhost/c.htm', 
    'http://localhost/d.htm' 
]; 

function loadNext(){ 

    var frameWindow = document.getElementById('test').contentWindow; 

    if(URLs.length > 0){ 
     setTimeout(function(){ 
      frameWindow.location.replace(URLs.shift()); 
     }, 1000); 
    } 
} 

<iframe id="test" onload="loadNext();"></iframe>

會不會是因爲你從localhost加載，加載時間是如此之小，你不會注意到它？

來源

2013-04-27 11:38:02 louisbros

爲setTimeout（）+1，我犯了一個錯誤，c.html包含一個加載b.html的iframe使我困惑... – daisy 2013-04-27 13:00:22

加載一個iframe中的一組一個接一個網頁

回答

相關問題