2009-05-22 162 views
12

我有一個正在通過另一個腳本動態插入的腳本。該腳本中的代碼被封裝在$(window).load()事件中,因爲它要求頁面上的圖像全部加載。在某些瀏覽器中,它可以正常工作,但在其他瀏覽器中,它似乎不會觸發,因爲頁面在代碼運行時已經完成加載。

有什麼辦法檢查頁面是否已經完成加載 - 無論是通過jQuery或JavaScript? (包括圖像)

在這種情況下,我無法訪問原始文檔的onload事件(除了通過加載的腳本更改它 - 但這似乎表現出同樣的問題)。

任何想法/解決方案/建議將不勝感激!

回答

7

你可以嘗試建立是威盛的超時將調用的處理程序檢查圖像以查看它們的屬性是否可用。清除load事件處理程序中的計時器,因此如果首先發生加載事件,則計時器不會觸發。如果這些屬性不可用,那麼load事件還沒有被觸發,並且您知道您的處理程序最終會被調用。如果他們是,那麼你知道負載事件發生在你的處理程序被設置之前,你可以簡單地繼續。

var timer = null; 
$(function() { 
    $(window).load(function() { 
     if (timer) { 
      clearTimeout(timer); 
      timer = null; 
     } 
     process(); 
    }); 
    timer = setTimeout(function() { 
     if (checkAvailable()) 
      process(); 
     } 
    }, 10*1000); // waits 10 seconds before checking 
}); 

function checkAvailable() 
{ 
    var available = true; 
    $('img').each(function() { 
     try { 
      if (this.height == 0) { 
       available = false; 
       return false; 
      } 
     } 
     catch (e) { 
      available = false; 
      return false; 
     } 
     }); 
     return available; 
    } 

    function process() { 
     ... do the real work here 
    } 
2

我認爲如果您使用$(document).ready而不是$(window).load來解決問題,請參閱jquery documentation

+0

距離鏈接的文檔片段: 簡而言之,這是使用window.onload的可靠替代品...您的綁定函數將被稱爲即時e DOM準備好被讀取和操作,這是所有JavaScript代碼需要運行的99.99%。 – TML 2009-05-22 01:59:16

+5

$(document).ready如果DOM就緒,但不等待圖像完成加載(如果我沒有弄錯),則會觸發。在這種情況下,我需要加載圖像以便我可以讀取它們的屬性。 – DismissedAsDrone 2009-05-22 02:07:43

+1

你可以閱讀沒有圖像加載的屬性... – trusktr 2011-05-17 05:44:52

相關問題