정확히 iframe onload 이벤트가 발사됩니까?

StackOverflow https://stackoverflow.com/questions/815263

문제

HTML이 완전히 다운로드되었을 때 iframe의 Onload 이벤트가 발사됩니까? (CSS/JS/IMG)

도움이 되었습니까?

해결책

후자의: <body onload= 모든 의존 요소 (CSS/JS/IMG)도로드 된 경우에만 화재가 발생합니다.

HTML이로드되었을 때 JavaScript 코드를 실행하려면 HTML이 끝날 때 다음을 수행하십시오.

<script>alert('HTML loaded.')</script></body></html>

여기에 있습니다 관련 이메일 스레드 의 차이에 대해 짐 그리고 준비가 된 (jQuery는 둘 다 지원합니다).

다른 팁

위의 답변 (온부하 이벤트 사용)이 정확하지만 경우에 따라 오작동하는 것 같습니다. 특히 웹 콘텐츠 용 인쇄 템플릿을 동적으로 생성 할 때.

동적 iframe을 만들고 인쇄하여 페이지의 특정 내용을 인쇄하려고합니다. 이미지가 포함되어 있으면 이미지를로드 할 때 발사 할 수 없습니다. 이미지가 여전히로드 될 때 항상 너무 빨리 발생하여 불완전한 인쇄가 발생합니다.

function printElement(jqElement){
    if (!$("#printframe").length){
        $("body").append('<iframe id="printframe" name="printframe" style="height: 0px; width: 0px; position: absolute" />');
    }

    var printframe = $("#printframe")[0].contentWindow;
    printframe.document.open();
    printframe.document.write('<html><head></head><body onload="window.focus(); window.print()">');
    printframe.document.write(jqElement[0].innerHTML);
    printframe.document.write('</body></html>');
//  printframe.document.body.onload = function(){
//      printframe.focus();
//      printframe.print();
//  };
    printframe.document.close();
//  printframe.focus();
//  printframe.print();

//  printframe.document.body.onload = function()...
}

보시다시피, 나는 OnLoad 핸들러를 바인딩하기위한 몇 가지 방법을 시도했습니다 ... 어쨌든 너무 일찍 발사됩니다. 브라우저 인쇄 미리보기 (Google Chrome)에는 깨진 이미지가 포함되어 있기 때문에 알고 있습니다. 인쇄를 취소하고 해당 함수를 다시 호출하면 (이미지가 캐시 됨) 인쇄 미리보기는 정상입니다.

... 다행히 솔루션을 찾았습니다. 예쁘지는 않지만 적합합니다. 'IMG'태그에 대한 하위 트리를 스캔하고 '완전한'상태를 확인합니다. 불완전한 경우 250ms 후에 다시 회전합니다.

function delayUntilImgComplete(element, func){
    var images = element.find('img');
    var complete = true;
    $.each(images, function(index, image){
        if (!image.complete) complete = false;
    });
    if (complete) func();
    else setTimeout(function(){
        delayUntilImgComplete(element, func);}
    , 250);
}    

function printElement(jqElement){
    delayUntilImgComplete(jqElement, function(){
        if (!$("#printframe").length){
            $("body").append('<iframe id="printframe" name="printframe" style="height: 0px; width: 0px; position: absolute" />');
        }

        var printframe = $("#printframe")[0].contentWindow;
        printframe.document.open();
        printframe.document.write(jqElement[0].innerHTML);
        printframe.document.close();
        printframe.focus();
        printframe.print();
    });
}

HTML이로드 될 때, 종속 요소가 아닙니다. (또는 그렇게 생각합니다).

나머지 페이지로드가 jQuery (wind

이미지 요소가로드되었는지 확인하고 이미지가있는 경우 확인할 수도 있습니다. 로드- 등

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top