Как вызвать событие 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, к которому переписывается iframe src (в данном случае - http://example.com/dload.py"), возвращает HTML, no проблема: срабатывает событие onload, содержимое диапазона заменяется, все довольны.

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

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

Ответы

Ответ 1

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

<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>

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

Ответ 2

Мое решение после множества разных подходов для получения этой работы через ff, т.е. сафари и хром не имели двухэтапной загрузки.

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

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

Ответ 3

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

Ответ 4

Вы можете проверить свойство 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);
}

Ответ 5

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

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