The previous blog described in detail the attributes, methods, and event handles of XMLHttpRequest. This blog will introduce the five-step usage of Ajax. To be intuitive, use a simple example: ajaxclient is used to submit a user name, And ajaxserver is used to determine whether the user name is used, and a prompt is returned.
Ajaxclient.html:
<HTML>Ajaxserver. aspx. CS
Protected void page_load (Object sender, eventargs e) {string getname = request ["name"]. tostring (). trim (); If (getname = "Lida") {response. write (getname + "unavailable, this user name has been used");} else {response. write ("available, this user name is not used ");}}
If the post method is used, you need to change the open () and send () methods and set the request header information:
// POST method // you need to specify the requstheader // write the request parameters to the send XMLHTTP. open ('post', 'ajaxserver', true); XMLHTTP. setRequestHeader ('content-type', 'application/X-WWW-form-urlencoded'); XMLHTTP. send ('name = '+ username );
Test results:
Step 1: Create XMLHttpRequest. As mentioned in previous blogs, you cannot use browser detection, but use capability detection. There are two types of XMLHttpRequest: activexobject used by ie5, ie5.5, and IE6, and XMLHttpRequest () used by other browsers (). Create a global XMLHTTP variable to store the XMLHTTPRequest object.
Step 2: register the callback function. Note that only the address of the callback function is passed to onreadystatechange, rather than the return value. Therefore, the callback function cannot contain parentheses.
Step 3: Set the interaction mode, address, parameters, and other information with the server.
Step 4: send a request to the server to start interaction with the server.
Step 5: Create a callback function to allow the callback function to receive data returned by the server and then update the page.
This example is enough to show only the interaction process between the Ajax server and the browser page. However, you need to understand not only the interaction process, but also many details, it also needs to be supplemented with further study.
I have used debugging functions provided by the browser before. Through debugging today, I found that the built-in developer tools are quite powerful, not only can I debug JS, you can also view the specific content of the source file, request, and response, as shown in the following figure:
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
