Query-ajax Load () method (27)

jQuery Load () method

The JQuery load () method is a simple but powerful AJAX method.

The load () method loads the data from the server and puts the returned data into the selected element. Syntax:

$ (selector). Load (url,data,callback);

The required URL parameter specifies the URL that you want to load.

The optional data parameter specifies the collection of query string key/value pairs that are sent with the request.

The optional callback parameter is the function name that is executed after the load () method completes.

Here is the content of the sample file ("Demo_test.txt"):

 
The following example loads the contents of the file "Demo_test.txt" into the specified <div> element: Example

$ ("#div1"). Load ("Demo_test.txt");
 
Try it yourself.

You can also add the JQuery selector to the URL parameter.

The following example loads the contents of the id= "P1" element in the "Demo_test.txt" file into the specified <div> element: instance

$ ("#div1"). Load ("Demo_test.txt #p1");
 
Try it yourself.

The optional callback parameter specifies the callback function to be allowed after the load () method completes. The callback function can set different parameters: Responsetxt-Contains the result content when the call succeeds Statustxt-contains the state of the call XHR-contains the XMLHttpRequest object

The following example displays a prompt box after the load () method finishes. If the load () method is successful, the "External content loading succeeded" is displayed. ", and if it fails, an error message is displayed: instance

$ ("button"). Click (function () {
  $ ("#div1"). Load ("Demo_test.txt", function (RESPONSETXT,STATUSTXT,XHR) {
    if ( statustxt== "Success")
      alert ("External content loading succeeded.") ");
    if (statustxt== "error")
      alert ("Error:" +xhr.status+ ":" +xhr.statustext);
  });

 
Try the jQuery AJAX Reference manual for yourself

 For a complete Ajax method reference, please visit our  jquery Ajax reference manual