>  기사  >  웹 프론트엔드  >  IE browser_javascript 기술의 잘못된 이미지 온로드 이벤트에 대한 솔루션

IE browser_javascript 기술의 잘못된 이미지 온로드 이벤트에 대한 솔루션

WBOY
WBOY원래의
2016-05-16 16:50:48962검색

스토리 모드 구현은 현재 탐색 중인 사진과 그 아래 두 장의 사진만 로드하는 것이며, 사진이 로드되기 전에는 1픽셀 사진이 사용됩니다. 로딩 클래스는 로딩 배경 이미지를 표시하고 시각적 영역에 있다고 판단되면 로딩 클래스를 삭제합니다.

문제는 테스트 도중 IE에서는 로딩 클래스를 삭제할 수 없는 것으로 나타났습니다.

코드 복사 코드는 다음과 같습니다.

img.src = _src;
img.src = _src;
img.onload = function(){
_con.delClass('loading') ;
}

온라인에서 검색해 보니 onload 순서와 src를 정의하는 문을 변경해야 한다는 것을 알았습니다. 캐시 및 온로드가 전혀 트리거되지 않습니다. Opera에도 이 문제가 있습니다. 올바른 코드 수정은 다음과 같습니다.

img.onload = function(){
_con.delClass('loading');
};
img.src = _src;

즉시 정상화됩니다


결론: Onload는 src 앞에 작성해야 하며, 먼저 이미지가 로드된 후 무엇을 해야 할지 브라우저에 지시한 다음 이미지를 로드하도록 놔두세요. 따라서 IE 브라우저가 onload 이벤트를 발생시키지 않는 것이 아니라 로딩 버퍼 속도가 너무 빠르기 때문에 로딩 후에 무엇을 해야 할지 알려주지 않고 이미 로딩을 완료한 것입니다. 반면에 Firefox는 확실히 더 똑똑합니다. onload 이벤트를 추가한 후 Firefox 브라우저는 버퍼에 이미 이 이미지가 있는지 여부를 감지하고, 그렇다면 이 이벤트를 직접 트리거합니다.

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.