JQuery Ajax usage with Ajax learning notes

. $.post (URL, params, callback) downloads a page by post to return XMLHttpRequest

URL: Requested page

Params: Represents the requested parameter to send.

Callback: The method called after the request is completed

eg

The code is as follows	Copy Code
$.post ("test.cgi", {Name: "John", Time: "2pm"}, function (data) { Alert ("Data Loaded:" + data); } );

Ajaxstart (CALLBACK) triggers the callback before the AJAX request is sent.

eg

The code is as follows	Copy Code
$ ("#loading"). Ajaxstart (function () { $ (this). Show (); });

Ajaxsend (CALLBACK) triggers the callback when an AJAX request is sent, and the parameters are XMLHttpRequest and the settings request setting eg:

The code is as follows	Copy Code
$ ("#msg"). Ajaxsend (function (request, settings) { $ (this). Append ("<li>starting request at" + Settings.url + "</li>"); });

Ajaxcomplete (callback) calls callback when an AJAX request completes. The callback parameter sets the eg for XMLHttpRequest and settings requests:

The code is as follows	Copy Code
$ ("#msg"). Ajaxcomplete (function (request, settings) { $ (this). Append ("<li>request complete.</li>"); });

Ajaxsuccess (callback) when an AJAX request succeeds, invoke the callback parameter to set the EG for the XMLHttpRequest and the settings request:

The code is as follows	Copy Code
$ ("#msg"). Ajaxsuccess (function (request, settings) { $ (this). Append ("<li>successful request!</li>"); });

Ajaxerror (callback) when an AJAX request fails, the callback parameter is set to the XMLHttpRequest and the settings request, eg:

The code is as follows	Copy Code
$ ("#msg"). Ajaxerror (function (request, settings) { $ (this). Append ("<li>error requesting page" + Settings.url + "</li>"); });

Ajaxstop (callback) when all AJAX requests are terminated, the callback is triggered

eg

The code is as follows	Copy Code
$ ("#loading"). Ajaxstop (function () { $ (this). Hide (); });

Load (URL, params, callback) loads the contents of the URL and inserts the resulting content into the DOM. Note: Avoid getting script scripts. You can use $.getscripturl: The requested page, params: the Sent parameter. Callback: callback function after the call completes. Eg:

The code is as follows	Copy Code
<div id= "Feeds" ></div>$ ("#feeds"). Load ("feeds.html") ==><div id= "Feeds" ><b>45</b > Feeds found.</div>;

The loadifmodified (URL, params,callback) feature is exactly the same as the 85-point load method. The only difference is that when the server side is judged by the lastmodify, there is no change. No request is made. DOM inserts are also not performed.

Serialize () This is a very useful method. Commonly used to serialize parameters for Ajax requests. Very convenient EG

The code is as follows	Copy Code
: <input type= ' text ' name= ' name ' value= ' John '/> <input type= ' text ' name= ' location ' value= ' Boston '/>$ ("input[@type =text]"). Serialize ();==>name=john& Location=boston

. $.ajax (params) is the most basic method of invoking Ajax in jquery and is very powerful. parameter is an object. All parameters are set in the form of Key:value

Here are a few of the main parameters:

(string) URL: The URL to be requested, you can set the parameter get parameter to the URL

(string) Type: The type of request, which can be post and get, by default

(string) DataType: The data format you expect to return can be Xml,html,script,json. The final return type is the server decision.

(Boolean) Ifmodified: Returns the correct value only if the return value is changed. The main judgment is based on the last-modified of the request head. By default, this value is set to False

(number) Timeout: Sets the request time, which replaces the global time ($.ajaxtimeout)

(Boolean) Global: Whether the global Ajax event handle is triggered. For example Ajaxstart,ajaxstop. The default is True

(function) Error: Functions that request error handling.

(function) Success: functions that request successful processing.

(function) Complete: a function that requests completion of processing.

(object|string) Data: Sent to the server side. If it is not a string, it is converted to a string and added to the URL as a query string. You can set the ProcessData state if you do not want to handle it in the default way.

(Boolean) ProcessData. The default is true, the object is converted to string, and the query string is made. can be set to false, then sent as domdocments.

(String) contentType. Default is "Application/x-www-form-urlencoded", the general situation does not need to be modified.

(Boolean) Async. The default value is True. Represents an asynchronous request, if you want to change to sync. Just set it to false.

(Function) beforesend. Used to set the request header before sending the request. have XMLHttpRequest as parameters

Example:

Take a JS file.

The code is as follows	Copy Code
$.ajax ({ Type: "Get", URL: "Test.js", DataType: "Script" })

Post data to the server side and prompt the user when successful.

The code is as follows	Copy Code
$.ajax ({ Type: "POST", URL: "some.php", Data: "Name=john&location=boston", Success:function (msg) { Alert ("Data Saved:" + msg); } });

Synchronizing Request data

The code is as follows	Copy Code
var html = $.ajax ({ URL: "some.php", Async:false })

. ResponseText transmission Domdocument,data will not be forcibly converted. var XmlDocument = [create XML document];

The code is as follows	Copy Code
$.ajax ({ URL: "page.php", Processdata:false, Data:xmldocument, Success:handleresponse });

$.ajaxsetup (settings) sets a global AJAX variable. Generally used to set some common request header settings.

The code is as follows	Copy Code
$.ajaxsetup ({ URL: "/xmlhttp/", Global:false, Type: "POST" } ); $.ajax ({data:mydata});

$.ajaxtimeout (time) sets global Ajax request times, when time is 0 or null to indicate an unlimited $.ajaxtimeout (5000); Represents the maximum 5 second request.

$.get (URL, params, callback) downloads a page. URL: page address, params: parameter, Key/value Mapcallback: method to call after the end of the request eg:

The code is as follows	Copy Code
$.get ("test.cgi", {Name: "John", Time: "2pm"}, function (data) { Alert ("Data Loaded:" + data); } );

$.getifmodified (URL, params, callback) is the same as get, except that the request is not processed if the requested page return value is unchanged.

code is as follows	copy code
$.getjson ( URL, params,callback) as with $.get, the return value is good in JSON format. $.getscript (URL, callback) downloads the script file and runs. Eg:$.getscript ("Test.js", function () {   alert ("Script loaded and executed. "); });