Zdarzenie onload dla dynamicznie tworzonych elementów iframe nigdy nie jest uruchamiane w IE

Question

Mam problem z IE, w którym zdarzenia iframe "onload/load" nie będą uruchamiać, gdy dynamicznie utworzę element iframe, ustawię jego źródło na plik pdf i dołączę do niego dokument.

Powodem, dla którego muszę posłuchać zdarzenia, jest to, że muszę ukryć element iframe do momentu załadowania ramki, a następnie użyć niektórych efektów, aby ją rozjaśnić.

Mam to do pracy w każdej przeglądarce, w której testowałem (Chrome, Firefox, Safari, mobilna Safari), ale nie będzie działać w IE8-> IE11.

Widziałem wiele postów na temat jak IE nie ognia zdarzenie onload, iz tego co zebraliśmy, następujące powinny pracować:

// listen for when the iframe's content has been loaded... 
if (window.addEventListener) 
    iframe.addEventListener("load", framedContentLoaded, false); 
else if (window.attachEvent) 
    iframe.attachEvent("onload", framedContentLoaded); 
else 
    iframe.onload = framedContentLoaded; 

Jednak moja funkcja framedContentLoaded nigdy nie dostaje zwolniony w IE.

Utworzyłem skrzypce, które reprodukuje problem: http://jsfiddle.net/s5TUU/

Answer 1

Prostym rozwiązaniem byłoby po prostu korzystać z Google przeglądarka PDF zamiast. Nie tylko pokazuje to plik PDF, ale własność onLoad niewątpliwie zadziała. Google Viewer: https://docs.google.com/viewer Należy również zauważyć, że właściwym sposobem osadzania plików PDF na stronie jest tag embed, a nie element iframe. Być może zamiast tego możesz spróbować użyć zdarzenia onreadystatechange?

Answer 2

Miałem ten sam problem, używałem wykrywania przeglądarki i zdarzenia onreadystatechange, aby zaspokoić IE, ale potem przestał działać dla IE11.

This bug has been reported i wymieniono obejście tego problemu.

Sposób obejścia problemu polega na umieszczeniu pliku pdf na stronie HTML z ramką iframe, a następnie załadowaniu strony html do podstawowego elementu iframe. Będziesz mieć zagnieżdżone ramki iframe, nie jest to ładne, ale wydaje się, że dobrze gra z IE. Będziesz używać zdarzenia onload, co czyni go rozwiązaniem wieloprzesyłowym. Musisz sprawić, aby rodzic i dziecko zmieniły rozmiar na taki sam rozmiar i wyłączyć paski przewijania w ramce nadrzędnej, aby nie otrzymywać podwójnych pasków przewijania.

W moim przypadku używałem ASP.Net MVC, ustawiłem mój macierzysty element iframe src na wywołanie akcji kontrolera z URL-a pdf przekazanego jako parametr adresu URL. Akcja zwróciła widok z dzieckiem iframe z plikiem PDF przypisanym do src.

Answer 3

Użyj jquery Do tego.

Var iframe = $ (""); iframe.attr ( .... )

$ ("# treści"). Html (iframe); iframe.load (myFunction);