보통 onerror 속성을 이용하여 대체 이미지를 보여주도록 처리하지만
대체 이미지가 삭제되거나 로딩되지 않을 경우 onerror 이벤트가 계속 발생하여 무한루프가 발생 ㅡㅡ;
이에 대한 대처방안으로 아래와 같은 방식으로 스크립트를 사용합니다.
1. 아래 로직은 일단 특정 이미지 로딩시 에러가 발생할 경우 imageErrChk() 평션을 호출하여 대체 이미지를 해당 이미지 태그의 src 로 변경처리합니다.
2. 대체 이미지가 정상적으로 로딩이 되었다면 더이상 imageErrChk() 펑션을 호출하지 않지만 만약 대체 이미지 도 오류가 발생할 경우 다시 imageErrChk() 펑션을 호출
3. 2번 대체이미지 오류의 경우 해당 이미지 오브젝트의 src가 "/img/common/img_ready3.gif" 로 바뀌어 있음으로
return; 처리를 하여 무한루프 발생을 막습니다.
<html>
<head>
<script>
//이미지 에러에 대한 처리
function imageErrChk(){
if(image_load.src.search("img_ready3")>-1){
return;
}
image_load.src="/img/common/img_ready3.gif";
}
<script>
</head>
<body>
<IMG ID="image_load" SRC="" HEIGHT="120" BORDER=1 onerror="javascript
</body>
</html>