Firefox support for Ajax onreadystatechange analysis _javascript Skills

First, the question:

Copy Code code as follows:

var xmlHttp;
function Savecarttodata () {
Createxmlhttprequest ();
var rndcode = new Date (). GetTime ();
var carturl = "A.asp?cache=" +rndcode
Xmlhttp.onreadystatechange = function () {
.....

}
Xmlhttp.open ("Get", carturl,true);
Xmlhttp.send (NULL);
}

The above code, Xmlhttp.onreadystatechange = function () {...}; Can be executed under FF, but if changed to

Xmlhttp.open ("Get", url,false); it's not going to be a problem.

Reason Analysis:

One: You can't use Xmlhttp.send (), you need content, if there is no content, use NULL

Second: After testing found that onreadystatechange in IE are very normal, but under FF3, can only run readystate=0 code. Unable to run readystate=4 code, a reason was found on the network:
Differences in Ajax Xmlhttprequest.onreadystatechange methods: In FF, when the state is 1 (that is, XMLHttpRequest has called Open but has not called send), FF continues to perform the generation after onreadystatechange Code, after the execution of onreadystatechange in the state 2,3,4 code, and IE will wait for the state of 2, after the completion of onreadystatechange State 2,3,4 code, continue to execute the following code, This problem arises, often we onreadystatechange code to handle the data obtained from the server (this data can only be obtained in the onreadystatechange state of 4 o'clock), so there is no problem in IE, Since it will wait for the onReadyStateChange state 4 to arrive after the data in the execution onreadystatechange behind, But since FF does not wait until onReadyStateChange state 4 arrives after executing the code behind onreadystatechange, the subsequent code cannot handle the data obtained from the server.

Workaround: Use JavaScript closures (the solution is inspired by Gmap). We pass a function to onReadyStateChange, which handles the data returned from the server in this function, but onreadystatechange is a parameterless function. Method in front of me the JavaScript attachevent pass parameter method has been introduced, here a little bit, is to pass a parameter to onReadyStateChange, However, in onreadystatechange, return is used as a parameterless function, which can be used in this parameterless function. This method works well in both IE and FF, so this is a good way to go.

This refers to the use of closures, very complex, in addition to the use of the Internet in the FF under the onload, is also not useful. After the exclusion of errors, the above mentioned reasons, is the fundamental, that is, in FF, the first time after the execution of onReadyStateChange, continue to send, but the back will not be back to perform onreadystatechange, has been silly to go down.

I'll just change it to:

Copy Code code as follows:

Xmlhttp.onreadystatechange = Xmlhandle;
Xmlhttp.open ("Get", url,false);
Xmlhttp.send (NULL);
Xmlhttp.onreadystatechange = Xmlhandle; Here add a line to block FF, let it again.


function Xmlhandle () {
if (Xmlhttp.readystate < 4) {
......
}else if (xmlhttp.readystate = = 4 && xmlhttp.status = 200) {
var cartresult = number (Xmlhttp.responsetext);
if (Cartresult = = 1) {
window.location.href= ' a.asp ';
}else if (Cartresult = = 2) {
......;
}else{
window.location.href= '/';
}
}
}

But this is not the case, the original FF 3 changed to: Xmlhttp.onreadystatechange = Xmlhandle (); However, with parentheses, IE does not, alas, originally feel ff is chicken skin, now feel FF is a "support standard" title, It's a waste of programmer time. But the hand of this procedure is really important, there is no way, only to debug to see if there is a more simple way, as follows:

Copy Code code as follows:

Xmlhttp.open ("Get", url,false);
Xmlhttp.send (NULL);
if (xmlhttp.status==200)
Xmlhandle ();

This code can be used for general use under IE and ff. However, because it is a synchronous call, you need to be prompted before the results are readystate<4, which is friendly to slow-speed customers. However, in order to get this waiting reaction in the case, due to the rapid response to the machine, will cause to see the customer prompts, so temporarily do not use this code

Only join browser type analysis.

Copy Code code as follows:

function Getos ()
{
var osobject = "";
if (Navigator.userAgent.indexOf ("MSIE") >0) {
return "MSIE"; IE browser
}
if (Isfirefox=navigator.useragent.indexof ("Firefox") >0) {
return "Firefox"; Firefox browser
}
if (Issafari=navigator.useragent.indexof ("Safari") >0) {
return "Safari"; Safan Browser
}
if (Iscamino=navigator.useragent.indexof ("Camino") >0) {
return "Camino"; Camino Browser
}
if (Ismozilla=navigator.useragent.indexof ("gecko/") >0) {
return "Gecko"; Gecko Browser
}
}

Then change the AJAX code to:

Copy Code code as follows:

var rndcode = new Date (). GetTime ();
var carturl = "A.asp?cache=" +rndcode
var btype=getos ();
Xmlhttp.onreadystatechange = (btype!= "Firefox")? Xmlhandle (): Xmlhandle;
Xmlhttp.open ("Get", carturl,false);
Xmlhttp.send (NULL);
Xmlhttp.onreadystatechange = (btype!= "Firefox")? Xmlhandle (): Xmlhandle;

Case II

Copy Code code as follows:

Gets the type of the browser to resolve onreadystatechange incompatibility problems
function Getos ()
{
var osobject = "";
if (Navigator.userAgent.indexOf ("MSIE") >0) {
return "MSIE"; IE browser
}
if (Isfirefox=navigator.useragent.indexof ("Firefox") >0) {
return "Firefox"; Firefox browser
}
if (Issafari=navigator.useragent.indexof ("Safari") >0) {
return "Safari"; Safan Browser
}
if (Iscamino=navigator.useragent.indexof ("Camino") >0) {
return "Camino"; Camino Browser
}
if (Ismozilla=navigator.useragent.indexof ("gecko/") >0) {
return "Gecko"; Gecko Browser
}
}
var objhttp;
function Searchcommoditybygroupid (groupId)
{
Objhttp = Gethttprequest ();
var tt=new Date ();
var url= "getcommoditylistbygroupid.htm?commoditygroupid=" +groupid+ "&time=" +TT;
var btype=getos ();

Objhttp.onreadystatechange= (btype== "Firefox")? Getcommodity (): getcommodity;
Objhttp.open ("Get", url,false);
Objhttp.send (NULL);
Objhttp.onreadystatechange= (btype== "Firefox")? Getcommodity (): getcommodity;
}
function getcommodity () {

if (objhttp.readystate==4)
{
if (objhttp.status==200)
{
document.getElementById ("Commoditydiv"). Innerhtml=objhttp.responsetext;
}
}
}

function Gethttprequest () {
var HttpRequest;
if (window. XMLHttpRequest) {
HttpRequest = new XMLHttpRequest ();
if (Httprequest.overridemimetype) {
Httprequest.overridemimetype (' Text/xml ');
}
}else if (window. ActiveXObject) {
try{
HttpRequest = new ActiveXObject ("Msxml2.xmlhttp");
}catch (e) {
try {
HttpRequest = new ActiveXObject ("Microsoft.XMLHTTP");
}catch (e) {}
}
}
return HttpRequest;
}