XMLHttpRequest in JavaScript to enable foreground-to-background interaction

Using the XMLHttpRequest object is divided into 4 parts:

1. Create a XMLHttpRequest Build

2. Setting the callback function

3. Initialize XMLHttpRequest Build

4. Sending the request

The first type:

1. var userName;
   var PassWord;
   var XMLHttpRequest;
   
   
   XMLHttpRequest Object
   function Createxmlhttprequest () {
   if (window. ActiveXObject) {//If it is IE browser
   return new ActiveXObject ("Microsoft.XMLHTTP");
   }else if (window. XMLHttpRequest) {//Non IE browser
   return new XMLHttpRequest ();
   }
   }
   
   function Onlogin () {
   UserName = Document.f1.username.value;
   PassWord = Document.f1.password.value;
   
   var url = "Loginservlet?username=" +username+ "&password=" +password+ "";
   
   1. Create a XMLHttpRequest Build
   XMLHttpRequest = Createxmlhttprequest ();
   
   2. Setting the callback function
   Xmlhttprequest.onreadystatechange = Zswfun;
   
   3. Initialize XMLHttpRequest Build
   Xmlhttprequest.open ("POST", url,true);
   
   4. Sending the request
   Xmlhttprequest.send (NULL);
   }
   
   
   callback function
   function Zswfun () {
   if (xmlhttprequest.readystate = = 4 && xmlhttprequest.status = = 200) {
   var B = xmlhttprequest.responsetext;
   if (b = = "true") {
   Alert ("Login successful! ");
   }else{
   Alert ("Login failed! ");
   }
   }
   }

The second type:

var xmlhttp;
function Verify1 () {
var username = document.getElementById ("username"). Value;
Determine the browser
if (window. XMLHttpRequest) {
For Firefox, Mozillar, Opera, Safari, IE7, IE8
Create a XMLHttpRequest Object
XMLHTTP = new XMLHttpRequest ();
Fix bugs in some browsers
if (Xmlhttp.overridemimetype) {
Xmlhttp.overridemimetype ("text/html");
}
}else if (window. ActiveXObject) {
For IE5, IE5.5, IE6
These two are passed as parameters for the plug-in name in order to create the ActiveXObject
var activename = ["MSXML2. XMLHTTP "," Microsoft.XMLHTTP "];
For (var i=0;i>activename.length (); i++) {
try{
Do not take out, if the creation is successful, the loop terminates, and if it fails, an exception is thrown to continue the loop
XMLHTTP = new ActiveXObject (Activename[i]);
Break
}catch (e) {
}
}
}
Determine if XMLHttpRequest was created successfully
/*if (!xmlhttp) {
Alert ("XMLHttpRequest creation failed!");
Return
}else {
Alert ("XMLHttpRequest created successfully!") +xmlhttp);
}*/
Registering callback Functions
Xmlhttp.onreadystatechange=callback;
url = "Classisservlet?name=" +username;
Setting connection Information
1. Is the way HTTP requests
2. Is the address of the server
3. Is synchronous or asynchronous, true is asynchronous
Xmlhttp.open ("GET", url,true);
The difference between a POST request and a GET request
The first parameter is set to post a second write-only URL address, and the third one is unchanged
Xmlhttp.open ("POST", "Classisservlet", true);
Post request to set the request header yourself
Xmlhttp.setrequestheader ("Content-type", "application/x-www-form-urlencoded");
Send data and start interacting with the server
Post Send Request
Xmlhttp.send ("name=" +username);
}
function callback () {
Receive response data
Determines whether the object state is interactively completed, and if 4 is done interactively
if (xmlhttp.readystate = = 4) {
Determines whether the object state interacts successfully, or 200 if successful
if (Xmlhttp.status = = 200) {
Receive data, get the server output of plain text data
var response = Xmlhttp.responsetext;
The node that gets the div displays the data on the DIV
var divresult = document.getElementById ("result");
divresult.innerhtml = response;
}
}
}

XMLHttpRequest in JavaScript to enable foreground-to-background interaction