Usage Analysis of document. onreadystatechange event

In the past two days, we are optimizing a project for the department. One of them is to implement all alert in the web application in div mode, and all the related javascript methods have been completed. The method is named showDialog, there is no problem in calling the showDialog method on the foreground page. However, once the page is submitted, the script is output from the background and the showDialog method is called, problems may occur from time to time, when an error is reported that the Internet site cannot be opened, the root cause of the problem still cannot be found during breakpoint debugging in the script, and the problem may be caused by incomplete page loading, therefore, modify the code of the Script output in the background and change it
Document. onreadystatechange = function () {if (document. readyState = 'complete') {showDialog ('webpage message', 'user name or password is incorrect. Please enter it again! ', 'Warning ');}};
Solve the problem. Everything is OK!
Copy codeThe Code is as follows:
Document. onreadystatechange = subSomething; // This method is executed when the page loading status changes.
Function subSomething ()
{
If (document. readyState = "complete") {// when the page loading status is complete
// The operation you want to perform.
}
}

Note: The onreadystatechange event can identify changes to the readyState attribute.

Question about the onreadystatechange attribute
When writing Ajax methods, we often write code similar to this:
Copy codeThe Code is as follows:
<Script type = "text/javascript">
Var xmlHttp;
// Create an XmlHttpRequeset object
Function createXMLHttpRequest ()...{
If (window. ActiveXObject )...{
XmlHttp = new ActiveXObject ("Microsoft. XMLHTTP ");
}
Else if (window. XMLHttpRequest )...{
XmlHttp = new XMLHttpRequest ();
}
}
// Start a request
Function startRequest ()...{

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

Function handlestatechange ()...{
If (xmlHttp. readyState = 4)... {// describes a "loaded" State. At this time, the response has been fully received.
If (xmlHttp. status = 200)... {// 200 indicates that the message is successfully received.
Alert ("The Server Replied with:" + xmlHttp. responseText)
}
}
}
</Script>

When I read this code for the first time, I felt something wrong, but I couldn't say anything wrong. With the further understanding of Ajax code, this feeling is always with me.

Later, I knew where this feeling came from.

Let's look at the startRequest function. We found that xmlHttp. onreadystatechange points to a function, which is triggered when xmlHttpRequest. readyState changes. Let's take a look at the startRequest function and imagine the entire request sending process. Now we click a button to trigger a startRequest function. The first step of the function is createXmlHttpRequest (). It creates an xmlHttpRequest object. When it is completed, xmlHttpRequest. the value of readyState is 0 (window. ), The program continues, xmlHttp. onreadystatechange = handlestatechange, because the status has not changed (xmlHttpRequest. the value of readyState is 0), so the function is not triggered, followed by Open () and Send (). Then, the whole function should not trigger the handlestatechange function from start to end, but why is the result correct?

Later, I used window. alert to track the changes in xmlHttp. readystate, and found that the mechanism of its operation was like this. After creating an xmlHttpRequest object, the value of xmlHttp. readyState is 0, and xmlHttp. onreadystatechange = handlestatechange is not running. Followed by open (). After this function occurs, xmlHttp. if the value of readyState is 1, a breakpoint will be disconnected from the Open () function, the field will be retained, and xmlHttp will be returned. onreadystatechange = handlestatechange run, and then execute the Send () function. After this function occurs, xmlHttp. the value of readyState is 2, and then xmlHttp is returned. onreadystatechange = handlestatechange run. And so on.

The browser cannot really program like the object-oriented method, so it finds a compromise, but this method looks like a nondescribable one. After half a day, I will discuss it with another student, this is the result.