Shanghai Yuecheng Technology A simple example of an AJAX request

Source: Internet
Author: User
Tags html form http post browser cache

Ajax is not a new programming language, but rather a technique for creating better, faster, and more interactive Web applications. With Ajax, you can use JavaScript's XMLHttpRequest object to communicate directly with the server. You can exchange data with the WEB server without overloading the page. In the example in this article, we will demonstrate how the Web page communicates with the Web server when the user enters data into a standard HTML form.

<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">

The following is a detailed description of the function of each JS function in the following example.
createxmlhttprequest ()Used to create a XMLHttpRequest object.
Because IE implements XMLHttpRequest as an ActiveX object, other browsers (Ff/safari/opera) implement it as a native JavaScript object. Because of these differences, the JavaScript code must contain the relevant logic.
createquerystring ()Used to tidy up the parameters and arrange the parameters of the AJAX request to be passed into a certain format.
If the delivery of Chinese or non-ASCII characters must be URL-encoded, this example uses the JS encodeURIComponent () function for parameter URL encoding.
Dorequestusingget ()Sends a request to the server in HTTP get and passes the parameters.
The open () method of the XMLHttpRequest object specifies the request that will be made. The open () method takes 3 parameters: one is the string that indicates which method is used (usually get or post), one is the string that represents the URL of the target resource, and the other is a Boolean value, which is just whether the request is asynchronous.
Get request, the passed parameter is written to the URL parameter of the Open method, at which time the parameter of the Send method is null.
In some cases, some browsers cache the results of multiple XMLHttpRequest requests at the same URL. If the response to each request is different, this will result in bad results, append the current timestamp to the end of the URL, to ensure the uniqueness of the URL, so as to avoid the browser cache results.
In this case, the server-side code uses ASP.
dorequestusingpost ()Sends a request to the server as an HTTP post and passes the parameters.
Make sure that the method specified in open () is post, you need to set the Content-type header information, simulate the HTTP POST method to send a form, so that the server will know how to handle the uploaded content. You must first call the Open method before you can set the header information.
Parameters must be passed using the Send method. The submission format of the parameter is the same as the URL in the Get method.
Handlestatechange ()Ajax callback function.
For XMLHttpRequest objects, the onReadyStateChange property stores a pointer to the callback function. This callback function is called when the internal state of the XMLHttpRequest object changes.
parseresults ()Process the response result.

Shanghai Yuecheng Technology A simple example of an AJAX request

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.