Ajax Use _ Miscellaneous class

Source: Internet
Author: User
Tags html form unique id

The XMLHttpRequest object is used to exchange data with the server. Send a request to the server

To send the request to the server, we use the open () and send () method of the XMLHttpRequest object:

Xmlhttp.open ("Get", "Test1.txt", true);
Xmlhttp.send ();
Method description Open (Method,url,async)

Specify the type of request, the URL, and whether the request is processed asynchronously. Method: The requested type; get or POST URL: file on the server async:true (asynchronous) or False (synchronous) send (String)

Send the request to the server. String: For post requests only get or post.

Get is simpler and faster than POST, and can be used in most cases.

However, use POST requests when you cannot send a large amount of data to the server using a cached file (a file or database on the update server) to send a user input that contains an unknown character, Post is more stable than get and more reliable get requests

A simple GET request:

Xmlhttp.open ("Get", "demo_get.asp", true);
Xmlhttp.send ();

Give it a shot yourself.

In the example above, you may get the result of the cache.

To avoid this, add a unique ID to the URL:

Xmlhttp.open ("Get", "demo_get.asp?t=" + math.random (), true);
Xmlhttp.send ();

Give it a shot yourself.

If you want to send information through the Get method, add information to the URL:

Xmlhttp.open ("Get", "Demo_get2.asp?fname=bill&lname=gates", true);
Xmlhttp.send ();

Try a POST request yourself

A simple POST request:

Xmlhttp.open ("POST", "demo_post.asp", true);
Xmlhttp.send ();

Give it a shot yourself.

If you need to POST data like an HTML form, use setRequestHeader () to add an HTTP header. Then specify the data you want to send in the Send () method:

Xmlhttp.open ("POST", "ajax_test.asp", true);
Xmlhttp.setrequestheader ("Content-type", "application/x-www-form-urlencoded");
Xmlhttp.send ("Fname=bill&lname=gates");

Try it for yourself. Description of setRequestHeader (Header,value)

Adds an HTTP header to the request. Header: The name of the specified header: value URL of the specified header-Files on the server

The URL parameter for the open () method is the address of the file on the server:

Xmlhttp.open ("Get", "ajax_test.asp", true);

This file can be any type of file, such as. txt and. xml, or server script files, such as. asp and. PHP (able to perform tasks on the server before returning a response). Async-True or False.

AJAX refers to asynchronous JavaScript and XML (asynchronous JavaScript and XML).

XMLHttpRequest Object if you want to use AJAX, the async parameter of its open () method must be set to true:

Xmlhttp.open ("Get", "ajax_test.asp", true);

For Web developers, sending asynchronous requests is a huge step forward. Many of the tasks performed on the server are quite time-consuming. This may cause the application to suspend or stop before AJAX occurs.

Instead of waiting for a response from the server, Ajax,javascript performs other scripts while waiting for a response from the server Async = True when the response is ready

When using Async=true, specify the functions that are executed when responding to the ready state in the onReadyStateChange event:

Xmlhttp.onreadystatechange=function ()
  if (xmlhttp.readystate==4 && xmlhttp.status==200)
    document.getElementById ("mydiv"). Innerhtml=xmlhttp.responsetext
Xmlhttp.open ("Get", "Test1.txt", true);
Xmlhttp.send ();

Give it a shot yourself.

You will learn more about onreadystatechange in later chapters. Async = False

If you want to use Async=false, change the third argument in the open () method to False:

Xmlhttp.open ("Get", "Test1.txt", false);

We do not recommend the use of Async=false, but for some small requests, it is possible.

Keep in mind that JavaScript waits until the server is ready to respond. If the server is busy or slow, the application hangs or stops.

Note: When you use Async=false, do not write the onreadystatechange function-put the code behind the Send () statement:

Xmlhttp.open ("Get", "Test1.txt", false);
Xmlhttp.send ();
document.getElementById ("Mydiv"). Innerhtml=xmlhttp.responsetext;

Give it a shot yourself.

Related Article

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.