Хотите вызвать функцию, если iframe не загружается или не загружается?

у меня есть iframe в моей странице. Если iframe Не загружается, хочу, чтобы это alert сообщением "pdf не найден" а если iframe загружается, он должен alert " pdf открыт".

кто-нибудь знает, как этого добиться?

8
html iframe javascript onload

2 ответов

Итак, идея состоит в том, чтобы использовать Ajax-запрос для "тестирования" URL. Ajax-запросы позволяют привязать обработчики" успех "и" ошибка " - в отличие от <iframe> элементы, которые предоставляют только обработчик" load".

конечно, Ajax-запросы ограничены той же политикой происхождения (если веб-сервер не включает CORS), но вы заявили, что PDF находится в том же домене, поэтому не должно быть никаких проблем.

кроме того, вы заявили, что используете библиотеку Mootools-я использую jQuery, поэтому я могу только предоставить вам решение jQuery, но так как мы делаем простой Ajax-запрос с обработчиками "успех" и "ошибка", вы должны быть в состоянии легко воссоздать решение Mootools на основе моего решения jQuery.

Итак, учитывая iframe и URL:

var iframe = $( '#iframe' )[0]; // reference to IFRAME element
var url = 'files/document1.pdf';

Ajax-запрос:

$.get( url, function () {
    iframe.onload = function () { alert( 'PDF opened!' ); };
    iframe.src = url;
}).error( function () { alert( 'PDF not found' ); });

успех-демо:http://jsfiddle.net/CZWdL/1/show/
ошибка-демо: http://jsfiddle.net/CZWdL/2/show/

Итак, если Ajax-запрос запускает событие "ошибка", мы просто немедленно оповещаем сообщение" не найдено". Если, однако, Ajax-запрос запускает событие "success", мы назначаем обработчик" load "нашему элементу IFRAME (этот обработчик" load "в конечном итоге предупредит" загруженное " сообщение) и устанавливаем URL-адрес его src свойства вручную.

9

вы можете просто добавить этот код в свой iframe, когда он загружен:

<script type="text/javascript">
<!-- 
        window.top.window.callback();
//-->
</script>

и на верхней странице:

<script type="text/javascript">
<!--
        function callback() {
                alert("File loaded!");
        }
//-->
</script>

если ваша функция обратного вызова не вызывается через 30 секунд, вы можете сказать, что ваш pdf не загружен.

изменить : Ваш первый файл (с кадра) :

<html>
    <head>
        <script type="text/javascript">
        <!--
            function callback() {
                alert("This file doesn't exist");
            }
        //-->
        </script>
    </head>
    <body>
        <iframe src="load_pdf.php?f=test.pdf" style="width:900px;height:500px;"></iframe>
    </body>
</html>

второй (php файл):

<?php
$file = $_GET['f'];

if(is_file($file)) {
    header('Content-type: application/pdf');
    readfile($file);
}
else {
    // This file doesn't exist
    echo '
        <script type="text/javascript">
        <!-- 
                window.top.window.callback();
        //-->
        </script>
    ';
}
?>

Не забудьте защитить $_GET ['f']

-2