윈도우나 이미지등 개체의 읽기 오류가 발생되면 이벤트가 발생된다.


이벤트 속성
object.onerror=handler JScript 만-
object.onerror=GetRef('handler') VBScript 5.0-
인라인 HTML <ELEMENT onerror ="handler"> 모든 플랫트폼
명명된 스크립트 <SCRIPT for= object event=onerror> Explorer-
이벤트 특성
Bubbles 없음
취소 가능
발생 원인
  • 유효하지 않은 개체를 참조하거나 보안 기준을 위반하는등의 런타임 스크립트 오류가 발생했을 때.
  • 이미지등의 개체를 다운로드하는 데 발생하는 오류가 발생했을 때.
디폴트 작용 브라우저 오류 메세지(description)를 디스플레이하고, 이벤트와 연관된 오류 보정 처리 과정을 수행한다.
HTML 규격 비규격 IE 확장.

DHTML 개체 모델에서 이벤트처리자는 파라메터들을 직접 받지는 못해도, event개체의 쿼리를 사용할 수 있다.

altKey ALT 키가 눌렸는가를 반환하거나 설정한다.
altLeft 왼쪽 ALT 키가 눌렸는가를 반환하거나 설정한다.
ctrlLeft 왼쪽 CTRL 키가 눌렸는가를 반환하거나 설정한다.
returnValue 이벤트로 부터의 반환값을 반환하거나 설정한다.
shiftLeft 왼쪽 SHIFT 키가 눌렸는가를 반환하거나 설정한다.
srcElement 이벤트를 발생시킨 개체를 반환하거나 설정한다.
type 이벤트 개체의 이벤트 명칭을 반환하거나 설정한다.
특기

윈도우(window)나 이미지(image)의 경우, 주소가 틀린 경우에도 오류가 발생(onerror 이벤트)한다

오류가 발생하였을 때 'JavascriptCode'를 실행하여 이를 적절히 처리할 수 있도록 방식을 제공한다.

window 이벤트에서 디폴트 IE 오류 메세지의 디스플레이를 억제하기 위하여, event 개체의 returnValue 속성을 true로 설정하거나, JScript에서 단순하게 return true을 설정한다,

onerror 이벤트는 런타임 오류에서 발생되고 컴파일 오류에서는 발생되지 않는다. 또한 스트림트 오류 디버깅(debugger)으로 열리는 오류 대화창은 return true 설정으로서 억제되지 않는다. 디버깅을 사용하지 않으려면 인터넷 메뉴의 도구 인터넷옵션 고급에서 스크립트 디버깅을 사용안 함을 체크하여 설정하여야 한다. 그러나 사용자 피씨에만 적용된다.

적용
개체scriptHTMLIE


이미지 onerror(오류) 표시 예제

이미지 표시할 위치

틀린 임의의 주소를 넣어 오류 발생시키고 주소가 틀림을 경고한다.

<SCRIPT>
function ErrorMessage(imgUrl){
  alert(imgUrl+'에 오류가 발생했다');
}
</SCRIPT>

<DIV id="showarea" style="border:solid 1;width:150;height:45;text-align:center">이미지 표시할 위치</DIV>
<INPUT type="button" value="틀린 이미지 보기"
  onClick="showarea.innerHTML='<IMG src=test.gif onError=ErrorMessage(\'이미지\')>'">

showarea로 지정된 DIV 의 내용에 이미지를 넣으려 시도하다 오류가 발생한다. 이를 기능함수를 통하여 틀렸음을 알려준다.

window.onerror, IMG.onerror 이벤트 예제

결과 표시창

오류를 의도적으로 발생시켰다.

<SCRIPT>
window.onerror=showIt;
function showIt(sMsg,sUrl,sLine){
  str='<DIV><B>오류가 발생되고 감지되었다.</B></DIV>';
  str+='Error='+sMsg+'<BR>';
  str+='Line='+sLine+'<BR>';
  str+='URL='+sUrl+'<BR>';
  imgObj.onerror=(str+='img 오류 : '+imgObj.src);
  show.innerHTML=str;
  return false;
}
function checkError(obj){
  eval(obj.value);
}
</SCRIPT>
<IMG id="imgObj" src="wrongAddress.gif">
<INPUT type="button" id=objA value="imgObj1.src='test.gif'" onclick="checkError(this)">
<INPUT type="button" id=objB value="variableA=undefinedB" onclick="checkError(this)">
<P>
<DIV id=show>결과 표시창</DIV>


IMG.onerror 이벤트로 이미지 대체 예제

onerror 이벤트에서 처리하는 방식을 설명한다.

<SCRIPT>
var imgStr='<IMG style="border:solid 1 red" id=imageObj alt="대체 문자열">';

function doLoad(){
  showDiv.innerHTML=imgStr;
  imageObj.onerror=doFail;
  imageObj.src='';
}
function doFail(){
   imageObj.alt='이미지 읽기 실패.';
 //  imageObj.src='../../gif/rfexample.gif'; // 여기에 새로운 이미지 주소를 넣어주면 새로운 이미지로 대체된다.
   return true;
}
</SCRIPT>
<FORM>
<INPUT type=button value="이미지 로딩" onclick="doLoad()">
</FORM>
<DIV id=showDiv></DIV>