jQuery onload - .load（） - 事件不適用於動態加載的iframe

我的腳本在用戶單擊按鈕時加載iframe。我想在iframe加載後調用另一個函數，但它不起作用。 iframe的確可以正常加載，但是在加載iframe之後永遠不會調用.load（）事件。 iframe包含來自同一網站的內容（無外部內容）。奇怪的是，我在我的代碼中的其他幾處使用了下面描述的相同技術，並且它完美地工作。任何人都可以提出我應該檢查什麼？jQuery onload - .load（） - 事件不適用於動態加載的iframe

下面是相關代碼：

$('#myIframe').load(function() { 
    alert('iframe loaded'); 
}); 

$('#someButton').live('click', function() { 
    $('body').append($('<iframe id="myIframe" src="https://www.mywebsite.com" width="100%"></iframe>')); 
});

來源

2011-11-22 jake

似乎有點類同這裏的問題是：

jQuery .ready in a dynamically inserted iframe

這樣IFRAME元素在DOM存在與追加。只有當您設置Url時，它纔會加載，您將在哪一點附加您希望在結尾標記的加載函數。因此，對於你的代碼

$('#someButton').live('click', function() { 

    $('body').append($('<iframe id="myIframe" width="100%"></iframe>')); 
    $('#myIframe').attr('src',"https://www.mywebsite.com"); 

    $('#myIframe').load(function() { 
     alert('iframe loaded'); 
    }); 

});

來源

2011-11-22 20:25:56 Chris

我遇到了類似的Firefox錯誤。具體來說，如果一個新的'iframe'元素被創建並插入到DOM中，但沒有指定'src'屬性，則'load'事件仍然會觸發。我詳細介紹了我的用例，並且在任何人遇到同樣的事情時都會採取措施：http://web.onassar.com/blog/2013/03/03/firefox-is-calling-the-load-event-to-soon -on-一個的iframe / – onassar

您的代碼示例不起作用的原因是因爲你被綁定到一個不存在的元素，那麼該元素將到DOM時，它具有連接到load沒有事件處理程序事件。試試這個：

$('#someButton').live('click', function() { 
    var $iframe = $('<iframe id="myIframe" src="" width="100%"></iframe>').load(function() { 
     alert('iframe loaded'); 
    }).attr('src', 'https://www.mywebsite.com'); 
    $('body').append($iframe); 
});

或接近的原始代碼，可以取代與.live('load')：

$('#myIframe').live('load', function() { 
    alert('iframe loaded'); 
}); 

$('#someButton').live('click', function() { 
    $('body').append('<iframe id="myIframe" src="https://www.mywebsite.com" width="100%"></iframe>');//notice I removed the $() around the append code as it is unnecessary 
});

來源

2011-11-22 20:33:13 Jasper

如果要加載在iframe的文檔是可以控制的東西，嘗試把負載處理程序進入該文件。如果你需要的父文檔的iframe加載後做的東西，你可以調用一個函數從孩子的父母：

// in parent doc 
function myIframeLoaded() { 
    // do something 
} 

// in iframe doc 
$(document).load(function() { // or .ready() 
    parent.myIframeLoaded(); 
}

來源

2011-11-22 20:33:39 nnnnnn

試試這個：

$("<iframe id='myId'></iframe>").appendTo("body") 
    .attr('src', url) 
    .load(function() 
    { 
     callback(this); 
    });

只是增加了一些鏈接，創建的元素選擇通常在哪裏（這是可能的），並將其附加到身體。

來源

2011-11-22 20:35:22 Purag

jQuery onload - .load（） - 事件不適用於動態加載的iframe

回答

相關問題