document.onreadystatechange 사건 의 용법 분석

이틀 동안 부서 의 한 항목 을 최적화 시 키 고 있 습 니 다.그 중 하 나 는 웹 응용 중의 모든 alert 를 div 방식 으로 실현 하 는 것 입 니 다.자바 script 의 관련 방법 을 모두 썼 습 니 다.방법 은 showDialog 이 고 프론트 페이지 에서 showDialog 방법 을 호출 하 는 것 은 문제 가 없습니다.그러나 페이지 가 제출 되면 백 스테이지 에서 스 크 립 트 를 출력 하고 showDialog 방법 을 호출 합 니 다.때때로 문제 가 발생 할 수 있 습 니 다.인터넷 사 이 트 를 열 수 없 는 오 류 를 보고 합 니 다.스 크 립 트 에서 인 터 럽 트 디 버 깅 을 해도 문제 의 근원 을 찾 을 수 없습니다.마지막 으로 인터넷 에서 찾 아 보 니 이 문 제 는 페이지 가 완전히 불 러 오지 않 아서 생 긴 것 일 수도 있 습 니 다.그래서 배경 출력 스 크 립 트 의 코드 를 수정 합 니 다.document.onreadystatechange=function(){if(document.ready State=='complete'){showDialog('웹 페이지 에서 온 메시지','사용자 이름 이나 비밀번호 오류,다시 입력 하 십시오!','warning'); } }; 문제 해결,모든 것 OK!

 
document.onreadystatechange = subSomething;//                  . 
function subSomething() 
{ 
if(document.readyState == "complete"){ //                
//      。 
} 
} 

설명:onreadystatechange 사건 은 ready State 속성의 변 화 를 식별 할 수 있 습 니 다.onready statechange 속성 에 대한 의문 은 Ajax 방법 을 작성 할 때 우 리 는 이런 코드 를 자주 쓴다.

 
<script type="text/javascript"> 
var xmlHttp; 
//    XmlHttpRequeset   
function createXMLHttpRequest()...{ 
if(window.ActiveXObject)...{ 
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); 
} 
else if(window.XMLHttpRequest)...{ 
xmlHttp = new XMLHttpRequest(); 
} 
} 
//       
function startRequest()...{ 

createXMLHttpRequest(); 
xmlHttp.onreadystatechange = handlestatechange; 
xmlHttp.open("GET", "SimpleRespose.xml", true); 
xmlHttp.Send(null); 
} 

function handlestatechange()...{ 
if(xmlHttp.readyState == 4)...{//    "   "  ；  ，         。 
if(xmlHttp.status == 200)...{//200       
alert("The Server Replied with:" + xmlHttp.responseText) 
} 
} 
} 
</script> 

이 코드 를 처음 읽 었 을 때 나 는 약간의 이상 함 을 느 꼈 지만 뭔 가 이상 하 다 고 말 할 수 없다.Ajax 코드 에 대한 이해 가 깊 어 지면 서 이런 느낌 은 항상 나 와 함께 한다.나중에 나 는 이런 느낌 이 어디에서 왔 는 지 알 게 되 었 다.startRequest 함 수 를 보 세 요.xmlHttp.onreadystatechange 가 함 수 를 가리 키 는 것 을 발 견 했 습 니 다.이 함 수 는 xmlHttpRequest.ready State 가 바 뀌 었 을 때 촉발 되 었 습 니 다.startRequest 함 수 를 다시 보 겠 습 니 다.전체 요청 이 보 내 는 절 차 를 상상 해 보 겠 습 니 다.지금 우 리 는 단 추 를 누 르 면 startRequest 함 수 를 터치 합 니 다.함수 아래로 내 려 갑 니 다.첫 번 째 단 계 는 createXmlHttpRequest()입 니 다.xmlHttpRequest 대상 을 만 드 는 역할 을 합 니 다.완료 되 었 을 때 xmlHttpRequest.ready State 의 값 은 0(window.alert 추적 으로 얻 은)입 니 다.프로그램 은 계속 내 려 갑 니 다.xmlHttp.onreadystatechange=handlestatechange 는 상태 가 바 뀌 지 않 았 기 때 문 입 니 다(xmlHttpRequest.ready State 의 값 은 0).그래서 함 수 를 촉발 하지 않 습 니 다.이 어 Open()과 Send()입 니 다.그러면 전체 함 수 는 처음부터 끝까지 handlestatechange 함 수 를 촉발 하지 않 았 을 것 입 니 다.그런데 왜 결과 가 정확 합 니까?나중에 나 는 window.alert 로 xmlHttp.readystate 의 변 화 를 추적 한 결과 원래 실행 되 는 메커니즘 이 이 렇 다 는 것 을 발견 했다.먼저 xmlHttpRequest 대상 을 만 든 후 xmlHttp.ready State 의 값 은 0 이 고 xmlHttp.onreadystatechange=handlestatechange 가 실행 되 지 않 았 습 니 다.다음은 open()입 니 다.이 함수 가 발생 한 후에 xmlHttp.ready State 의 값 이 1 입 니 다.그러면 하나의 정지점 이 Open()함수 에서 끊 어 지고 현장 을 보존 합 니 다.이 어 xmlHttp.onready state change=handlestatechange 에서 실 행 된 다음 에 Send()함 수 를 실행 합 니 다.이 함수 가 발생 한 후에 xmlHttp.ready State 의 값 은 2 입 니 다.이 어 xmlHttp.onreadystatechange=handlestatechange 로 되 돌아 가 실 행 됩 니 다.이런 식 으로 유추 하 다.브 라 우 저 는 진정 으로 대상 을 대상 으로 하 는 것 처럼 프로 그래 밍 할 수 없 기 때문에 절충 하 는 방법 을 찾 았 습 니 다.그러나 이 방법 은 이도 저도 아 닌 것 같 습 니 다.한참 동안 생각 하고 한 친구 와 함께 토론 한 후에 야 이런 결 과 를 얻 었 습 니 다.