IT

iframe로드 완료 이벤트

lottoking 2020. 8. 2. 17:15
반응형

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

다음과 같이 jquery ready 이벤트를 수도 있습니다.

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

다음은 실제 예입니다.

http://jsfiddle.net/ZrFzF/


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

참고 URL : https://stackoverflow.com/questions/3142837/capture-iframe-load-complete-event

반응형