Lazy load iframe (задержка src http call) с jquery

Ответ 1

Это сработало для меня.

var iframes = $('iframe');

$('button').click(function() {
    iframes.attr('src', function() {
        return $(this).data('src');
    });
});

iframes.attr('data-src', function() {
    var src = $(this).attr('src');
    $(this).removeAttr('src');
    return src;
});

jsFiddle.

Ответ 2

A аналогичный вопрос был недавно опубликован специально для iFrames с вкладками на основе Bootstrap на Twitter, на которые я ответил используя технику, которую я вызываю Lazy Загрузка iFrames. Js/jquery выглядит следующим образом; см. полный код, включая разметку html в скрипке или ответ на OP:

<script>
$('#myTabs').bind('show', function(e) {  

// identify the tab-pane
paneID = $(e.target).attr('href');

// get the value of the custom data attribute to use as the iframe source
src = $(paneID).attr('data-src');

//if the iframe on the selected tab-pane hasn't been loaded yet...
if($(paneID+" iframe").attr("src")=="")
{
    // update the iframe src attribute using the custom data-attribute value
    $(paneID+" iframe").attr("src",src);
}
});
</script>

Ответ 3

Вы всегда можете инициализировать атрибут src примерно: blank, а затем, когда срабатывает событие click, установите для атрибута src URL, к которому вы хотите перейти.

Ответ 4

Можете ли вы установить src примерно: blank? Как это?

http://jsfiddle.net/MaUfH/

Ответ 5

Если вы хотите сделать это в WordPress

Вот автоматическое сокращение запросов, решение

В плагине WordPress

Вот плагин WordPress, который вы можете скачать и установить вручную через репозиторий плагинов WordPress. Я создал это сегодня, чтобы справиться с этой ситуацией. Никаких изменений в контенте не требуется, это работает автоматически после активации на всех и всех iframe.

https://wordpress.org/plugins/lowermedia-iframes-on-demand/