Есть ли способ загрузить iframe асинхронно - PullRequest
39 голосов
/ 22 января 2010

У меня есть веб-страница с фреймом, указывающим на другой сайт. Я не хочу, чтобы это блокировало загрузку остальной части страницы. есть ли способ загрузить его асинхронно?

Ответы [ 8 ]

11 голосов
/ 22 января 2010

Это не должно блокировать. Если вы хотите, чтобы главная страница сначала полностью загружалась (например, изображения главной страницы перед содержимым iframe), вам придется использовать немного javascript для установки URL-адреса iframe, например <body onload="javascript:...">

8 голосов
/ 24 апреля 2012

Используя jQuery, это работает:

<script type="text/javascript">
  $(window).load(function() {
    var f = document.createElement('iframe');
    f.src = url; 
    f.width = 1000; 
    f.height = 500;
    $('body').append(f);
  });
</script>

, где url - некоторый URL.

4 голосов
/ 18 апреля 2012

Я думаю, что @Coxy правильно, что OnLoad не сработает. По крайней мере, при запуске некоторых тестов производительности веб-страницы мне показалось, что iframe считает, что страница полностью загружена. Поэтому я использую этот небольшой фрагмент jQuery для загрузки iframe:

HTML: <iframe id="blabla"></iframe>

JS:

$(window).load(function() {
   if ($('#blabla').length <= 0) { return; }  // to avoid errors in case the element doesn't exist on the page / removed.
   $('#blabla').attr('src','//example.com/page');
});
4 голосов
/ 22 января 2010

iframes должны загружаться асинхронно без каких-либо усилий с вашей стороны.

3 голосов
/ 22 января 2010

Одна из проблем, с которой мы столкнулись, заключалась в том, что, хотя iframe уже загружаются асинхронно, главная страница не будет запускать OnLoad, пока iframe также не завершит загрузку.

Мы обошли это, «подделав» OnLoad, вызвав нужный нам метод в элементе script внизу главной страницы, даже вне закрывающего тега body:

</body>
<script  type='text/jscript' language='javascript'>
BodyOnready();
</script>
2 голосов
/ 22 июля 2013

вы можете подождать, пока после 'onload' не будет установлен src для iframe:

<body onload="loadFrame">

тогда как то так:

function loadFrame(){
    var myFrame = document.getElementById('myFrame');
    myFrame.src = "myURL";
};
2 голосов
/ 22 января 2010

Хотя я согласен, что этого не должно происходить, вы можете подождать, пока ваша веб-страница будет полностью загружена, а затем загрузить содержимое iframe. С jQuery, я думаю, вы можете сделать что-то вроде этого:

  • Предположим, ваш IFRAME выглядит следующим образом: <iframe name="theOtherPage"></iframe>

<code>
$(document).ready(function(){
  (window.frames || document.frames)["theOtherPage"].window.location = "<a href="http://theotherpage.com/" rel="nofollow noreferrer">http://theotherpage.com/</a>"; 
});
0 голосов
/ 05 апреля 2017

Несколько альтернатив ванили JS:

HTML:

<iframe id="YOURID" src="about:blank">Loading...</iframe>

JS:

window.onload = function(){
  document.getElementById('YOURID').src = 'https://insertYourUrlHere.com'
};
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...