iframe로드 완료 이벤트 캡처 페이지에서 완전히로드되었을 때 캡처하는 방법이 있습니까?

iframe의 내용이 부모 페이지에서 완전히로드되었을 때 캡처하는 방법이 있습니까?

답변

<iframe>요소에 대한 load이벤트 가 있습니다.

그 사건을 듣는 방법은 당신에게 달려 있지만 일반적으로 가장 좋은 방법은 다음과 같습니다.

1) 프로그래밍 방식으로 iframe 만들기

iframe load이로 드 되기 전에 리스너를 연결하여 항상 리스너를 호출 해야합니다 .

<script>
var iframe = document.createElement('iframe');
iframe.onload = function() { alert('myframe is loaded'); }; // before setting 'src'
iframe.src = '...';
document.body.appendChild(iframe); // add it to wherever you need it in the document
</script>

2) 인라인 자바 스크립트 는 HTML 마크 업 내부에서 사용할 수있는 또 다른 방법입니다.

<script>
function onMyFrameLoad() {
  alert('myframe is loaded');
};
</script>

<iframe id="myframe" src="..." onload="onMyFrameLoad(this)"></iframe>

3) 또한 이벤트 리스너를 부착 할 수 있는 요소 후 돌며, <script>태그,하지만이 경우, iframe이 이미 당신이 당신의 청취자를 추가에 도착하는 시간에 의해로드되는 약간의 가능성이 있음을 유의하십시오. 따라서 iframe이 매우 빠르거나 캐시에서 오는 경우와 같이 호출 되지 않을 수 있습니다.

<iframe id="myframe" src="..."></iframe>

<script>
document.getElementById('myframe').onload = function() {
  alert('myframe is loaded');
};
</script>

또한 이 유형의 이벤트를 발생시킬 수있는 요소 에 대한 다른 답변을 참조하십시오load

답변

위의 답변 중 어느 것도 나를 위해 효과가 없었지만 이것은

업데이트 :

@doppleganger가 아래에서 지적했듯이 jQuery 3.0부터로드가 사라 졌으므로 다음을 사용하는 업데이트 된 버전이 on있습니다. 이것은 실제로 jQuery 1.7 이상에서 작동하므로 jQuery 3.0이 아닌 경우 에도이 방법으로 구현할 수 있습니다.

$('iframe').on('load', function() {
    // do stuff 
});

답변

이를 위해 바닐라 자바 ​​스크립트 에는 또 다른 일관된 방법이 있습니다 ( IE9 +에만 해당 ).

const iframe = document.getElementById('iframe');
const handleLoad = () => console.log('loaded');

iframe.addEventListener('load', handleLoad, true)

그리고 Observables에 관심이 있다면 트릭을 수행하십시오.

return Observable.fromEventPattern(
  handler => iframe.addEventListener('load', handler, true),
  handler => iframe.removeEventListener('load', handler)
);

답변

오프 스크린 일 때 iframe이로드되면 onload 이벤트가 발생하지 않는 것 같습니다. “새 창에서 열기”/ w 탭을 사용할 때 자주 발생합니다.

답변

이 방법으로 jquery ready 이벤트를 캡처 할 수도 있습니다. 

$('#iframeid').ready(function () {
//Everything you need.
});

다음은 실제 예입니다.

http://jsfiddle.net/ZrFzF/

답변