Определить, успешно ли загружен контент iframe - PullRequest
31 голосов
/ 28 декабря 2010

У меня есть виджет, который содержит iframe. Пользователь может настроить URL-адрес этого iframe, но если URL-адрес не может быть загружен (он не существует или у пользователя нет доступа к Интернету), тогда iframe должен переключиться на автономную страницу по умолчанию.

Вопрос в том, как я могу определить, может ли iframe загружаться или нет? Я попытался подписаться на событие «load», и, если через некоторое время это событие не сработало, я переключаюсь, но это работает только в Firefox, так как IE и Chrome запускают событие «load», когда «Страница не найдена» отображается.

Ответы [ 6 ]

14 голосов
/ 07 января 2011

Я нашел следующую ссылку через Google: http://wordpressapi.com/2010/01/28/check-iframes-loaded-completely-browser/

Не знаю, решает ли это проблему «Страница не найдена».

<script type="javascript">
var iframe = document.createElement("iframe");
iframe.src = "http://www.your_iframe.com/";
if (navigator.userAgent.indexOf("MSIE") > -1 && !window.opera) {
  iframe.onreadystatechange = function(){
    if (iframe.readyState == "complete"){
      alert("Iframe is now loaded.");
    }
  };
} else {
  iframe.onload = function(){
    alert("Iframe is now loaded.");
  };
}
</script>

Я сам не пробовал, поэтому не знаю, работает ли он. Удачи!

7 голосов
/ 09 января 2011

В настоящее время браузеры имеют ряд ограничений безопасности, которые не позволяют вам использовать контент iframe (если он не принадлежит вашему домену).

Если вам действительно нужны эти функции, вам нужно создать страницу сервера, которая должна работать в качестве прокси-сервера, которая получает URL-адрес в качестве параметра, проверить, является ли он действительным URL-адресом, а также перенаправить или отобразить страницу с ошибкой. .

4 голосов
/ 09 октября 2015

Если вы контролируете содержимое iframe, iframe может отправить сообщение родителю.

        parent.postMessage('iframeIsDone', '*');

Родительский обратный вызов прослушивает сообщение.

        var attachFuncEvent = "message";
        var attachFunc = window.addEventListener ;
        if (! window.addEventListener) {
            attachFunc = window.attachEvent;
            attachFuncEvent = "onmessage";
        }

        attachFunc(attachFuncEvent, function(event) {
            if (event.data ==  'iframeIsDone') { // iframe is done callback here
            }
        });
2 голосов
/ 10 декабря 2012

Как насчет проверки, доступен ли URL-адрес, и только затем устанавливать фактический URL-адрес iframe?например, с JQuery

var url = "google.com"
var loading_url = "/empty.html"
document.getElementById("iframe").src = loading_url;
$.ajax({
    url: url,
    type: 'GET',
    complete: function(e, xhr, settings){
         if(e.status === 200){
              document.getElementById("iframe").src = url;
         }
    }
});

Редактировать: Кажется, что это не работает междоменный, код состояния в этих случаях 0.

0 голосов
/ 07 января 2011

После срабатывания загрузки вы можете очистить содержимое iframe, чтобы увидеть, содержит ли оно полезную страницу или нет.К сожалению, вам придется настроить этот браузер так, чтобы все они отображали различное сообщение «страница не найдена».

Для получения дополнительной информации посмотрите здесь http://roneiv.wordpress.com/2008/01/18/get-the-content-of-an-iframe-in-javascript-crossbrowser-solution-for-both-ie-and-firefox/

0 голосов
/ 28 декабря 2010

Если у вас есть контроль над содержимым iframe (например, вы можете добавить произвольный код на страницу), вы можете попробовать реализовать специальную функцию в каждом из них, а затем на своей странице вы вызываете эту функцию и ловитеошибка (через обработчик window.onerror), если функция, вызванная через eval, не работает, потому что страница не загружалась.

Вот пример кода: http://www.tek -tips.com / viewthread.cfm? qid =1114265 и страница = 420

...