2009-10-06 2 views
10

한다고 가정 우리는 다음과 같은 HTML 파일이 :iframe에서 파일을 다운로드 할 때 onload 이벤트를 트리거하는 방법은 무엇입니까?

<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 반환, 아무 문제 : onload 이벤트가 발생합니다, 스팬의 내용이 대체되어 모두 행복합니다.

그러나 URL에 의해 반환 된 파일의 콘텐츠 형식이 브라우저가 파일 저장 대화 상자를 강제로 열도록 설정되어 있으면 iframe의 onload 이벤트가 실행되지 않습니다.

해결 방법이 있습니까? iframe을 사용하는 것은 필요하지 않습니다. 브라우저가 제공된 파일을 다운로드하기 시작하면 콜백이 시작됩니다.

+0

아약스를 사용하여 파일을 가져 와서 데이터 URI로 'a' 태그 (링크)를 만들고 클릭하면 큰 파일로 테스트하지 못했습니다. – jcubic

답변

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 이벤트가 다시 발생하지 않습니다.

+0

매우 똑똑! 고맙습니다. Chrome에서는 작동하지 않지만 Firefox에서 적어도 작동하고 여러 번 작동합니다. 실제로 innerHTML을 덮어 쓰므로 onload 이벤트를 발생시키는 새 iframe이기 때문입니다. – dpq

+0

나는 그것이 당신을 위해 일해서 기뻐요, 나는 크롬에서 그것을 테스트하지 않았습니다. – jerjer

+0

이것은 파이어 버그가 돌아가고있는 한 내가 가지고있는 비슷한 문제에서 효과가있는 것으로 보입니다. 파이어 폭스없이 파이어 폭스 2 또는 3에서 시도했을 때 갑자기 온로드가 실행되지 않습니다.차이점이 누구인지 아시겠습니까? – justkt

-1

이 작업을 수행 할 수 있습니다 예를 들어 당신은 이것에 대한 JQuery와의 도움이 필요할 수 있습니다 여기에 를 내 해결 방법, 그것은을 위해 작동하는지 확인하십시오 수 있습니다 :

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

아니요, 작동하지 않습니다. 비동기 호출은 반환 된 값을 결과 변수에 저장하고 저장 대화 상자를 여는 대신 콜백 함수에 전달합니다. – dpq

0

나는 동일한 문제를 가지고 있으며, onLoad 핸들러는 내용이 변경 될 때만 작동합니다. 파일을 다운로드하는 경우. iframe에서 파일 내용을 인쇄하기 위해 HTTP 헤더를 삭제하면 onload가 제대로 작동하지 않습니다.

+1

HTTP 헤더를 삭제하고 웹 브라우저에서 파일을 다운로드하려면 어떻게해야합니까? – anmarti

1

사파리와 크롬에서 작동하는 여러 가지 방법을 사용한 후 내 솔루션은 2 단계 다운로드가 없었습니다.

iframe을 만들 원래 JS 요청은 일반적으로 pdf를로드하는 src를로드합니다. 그러나 이제 src에 pdf의 URL이 포함 된 다른 iframe이있는 페이지가로드됩니다. html 응답에서 나는 또한 iframe에 내 onload했을 window.parent.window.handlerfunction에 대한 내 응답을 호출하는 캐치 올 setTimeout funciton을 트리거합니다. 결과는 더 이상 실제 iframe로드를 감지하지 않고 오히려 지원되는 부모/자식 창 관계에 의존하므로 브라우저에서 작동하는 핸들러 함수의 최상위 상위에있는 PDF 다운로드 및 트리거입니다. 이 또한 있었다 누군가가이 완료 될 때까지 당신은 짧은 시간 간격 이후에 반복적으로 iframe이 readyState의 속성을 확인할 수 있습니다

0

붙어 있습니다

희망.

+0

나는 PHP베이스를 다운로드 받았고, 처음 플러시 한 후에도 데이터가 브라우저로 보내지고 상태는 다운로드가 진행 중임에도 완료로 표시됩니다. – jcubic

관련 문제