Как вызвать событие onload при загрузке файла в iframe?

предположим, что у нас есть следующий HTML-файл:

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Test iframe download</title>
<script type="text/javascript">

var init = 0;

function download() {
  document.getElementById("dload_frame").src = "http://example.com/dload.py";
}

function alert() {
  if (init == 0) {
    init = 1;
  }
  else {
    document.getElementById("alert_span").innerHTML = "Got it!";
  }
}

</script>
</head>
<body>

  <span id="alert_span">Main content.</span><br/>
  <input type="button" value="Download" id="btn" onclick="download()" />
  <iframe id="dload_frame" src="http://404.com/404" onload="alert()"> </iframe>

</body>
</html>

теперь, если URL, к которому src iframe переписывается (в этом случае -"http://example.com/dload.py") возвращает HTML, без проблем: событие onload срабатывает, содержимое span заменяется, все счастливы.

однако, если тип содержимого файла, возвращаемого URL-адресом, установлен на что-то, что заставляет браузер открывать диалоговое окно сохранения файла, событие onload iframe никогда пожары.

есть ли обходной путь? Использование iframes не требуется, желаемое поведение-запустить обратный вызов после того, как браузер начнет загрузку предоставленного файла.

11
download iframe onload

5 ответов

я столкнулся с той же проблемой, это: Вот моя работа, пожалуйста, посмотрите, работает ли она для вас:

<script>
 function download(){
    var url = 'http://example.com/dload.py';
    var htm = '<iframe src="' + url +'" onload="downloadComplete()"></iframe>';
    document.getElementById('frameDiv').innerHTML = htm;
 }
</script>

<div style="display:none" id="frameDiv">
</div>
<button onclick="download()">download file</button>

насколько я помню, событие onload iframe срабатывает только один раз. Установка другого значения для атрибута src не приведет к повторному запуску события onload.

1

мое решение после многих разных подходов, чтобы получить эту работу через FF ie safari и chrome, не было загрузки 2 шага.

исходный запрос JS для создания iframe загружает src, который обычно загружал pdf Однако src теперь загружает страницу с еще одним iframe внутри нее, который теперь содержит url-адрес pdf. в ответе html я запускаю onload, а также функцию catchall setTimeout, которая вызывает мой ответ на окно.родитель.окно.handlerfunction, который мой onload на верхнем iframe был бы. Результатом является загрузка PDF и триггер на родительском уровне верхнего уровня функции обработчика, которая работает в браузерах, поскольку она больше не зависит от обнаружения фактической загрузки iframe, а зависит от поддерживаемых отношений родительского/дочернего окна.

надеюсь, это поможет кому-то, кто также застрял

1

У меня такая же проблема, обработчик onLoad срабатывает только при изменении содержимого. Если вы загрузите файл. Если вы удалите заголовок HTTP для печати содержимого файла в iframe, загрузка будет правильно запущена.

0

вы можете проверить свойство iframe readyState повторно через короткие промежутки времени, пока оно не будет завершено.

function iframe_onload(iframe_id, js) {
    var iframe = document.getElementById(iframe_id);
    var iframeDoc = iframe.contentDocument || iframe.contentWindow.document;

    if (iframeDoc.readyState == 'complete') {
        eval(js)
        return;
    }

    window.setTimeout('iframe_onload("' + iframe_id + '",`' + js + '`);', 100);
}
0

вам может понадобиться помощь jquery для этого, например, вы можете сделать это:

$.get('http://example.com/dload.py',{},function(result){
   $('alert_span').html(result);//or some content
});
-1