JQuery Ajax and jQueryAjax

JQuery Ajax and jQueryAjax

1. Load (url, [data], [callback])

Purpose:

Load the remote HTML file code and insert it into the DOM.

Parameters:

Url (String): the URL of the requested HTML page.

Data (Map): (optional) key/value data sent to the server.

Callback (Callback): (optional) callback function when the request is completed (success is not required.

Note:

By default, this method uses the GET method to pass data. If the [data] parameter has passed data, it will be automatically converted to the POST method.

Explanation:

Load is the simplest Ajax function, but its usage has limitations:

It is mainly used to directly return HTML Ajax interfaces.

Load is a jQuery packaging set method. It needs to be called in the jQuery packaging set and will load the returned HTML to the object, even if the callback function is set, it will still load.

　　2. jQuery. get (url, [data], [callback], [type])

Purpose:

Use the GET Method for asynchronous requests.

Parameters:

Url (String): the URL of the request.

Data (Map): (optional) data to be sent to the server, expressed in key/value pairs, will be appended to the request URL as QueryString.

Callback (Function): (optional) callback Function upon successful loading (this method is called only when the Response returns success ).

The type parameter refers to the data type. Possible values include "xml", "html", "script", "json", "jsonp", and "text ", the default value is "html ".

The jQuery. getJSON (url, [data], [callback]) method is equivalent to jQuery. get (url, [data], [callback], "json ")

Note:

Load information through remote http get requests. This simple GET request function replaces the complex $. ajax. callback function can be called when the request is successful.

Explanation:

This function sends a Get request. parameters can be directly spliced in URLs, for example

$. Get ("AjaxGetMethod. aspx? Param = btnAjaxGet_click ");

Or pass the data parameter:

　　　　　$.get("AjaxGetMethod.aspx", { "param": "btnAjaxGet_click" });

The two methods have the same effect. The data parameter is automatically added to the requested url.

　3. jQuery. getJSON (url, [data], [callback])

Purpose:

Loading JSON data through http get requests is equivalent to jQuery. get (url, [data], [callback], "json.

Note:

Load JSON data using http get requests.

Explanation:

The getJSON function only sets the type parameter of the get function to "JSON.

4. jQuery. getScript (url, [callback])

Purpose:

Load and execute a JavaScript file using GET requests.

Parameters:

Url (String): Address of the JS file to be loaded.

Callback (Function): (optional) callback Function after successful loading.

Note:

Before jQuery 1.4, getScript can only call JavaScript files in the same domain. In jQuery 1.4, you can call JavaScript files across domains.

Explanation:

First, understand the jQuery internal implementation of this function, and still use the get function. All Ajax functions of jQuery, including get, use jQuery. ajax ().

　　5. jQuery. post (url, [data], [callback], [type])

Purpose:

Use POST for asynchronous requests

Parameters:

Url (String): the URL of the request.

Data (Map): (optional) data to be sent to the server, expressed in key/value pairs.

Callback (Function): (optional) callback Function when the load is successful (this method is called only when the Response returns success ).

Type (String): (optional) the official description is: Type of data to be sent. In fact, it should be the client request type (JOSN, XML, etc)

Note:

Load information through remote http post requests. This simple POST Request function replaces the complex $. ajax. callback function can be called when the request is successful.

Explanation:

The specific usage is the same as get, but the submission method is changed from "GET" to "POST ".

　6. jQuery. ajax (options)

　　　　Purpose:

Load remote data using HTTP requests

Note:

HTTP requests are used to load remote data. jQuery underlying AJAX implementation. Simple and Easy-to-use high-level implementation is $. get, $. post, and so on.

$. Ajax () returns the created XMLHttpRequest object. In most cases, you do not need to directly operate on this object, but in special cases it can be used to manually terminate the request.

$. Ajax () has only one parameter: The parameter key/value object, which contains information about various configurations and callback functions.

Explanation:

This is the core function of Ajax in jQuery. All the above functions that send Ajax requests will finally call this function. options parameters support many parameters and can be used to completely control ajax requests.

Options parameter list

Parameter Name	Type	Description
Url	String	(Default: Current page address) the address of the request sent.
Type	String	(Default: "GET") Request Method ("POST" or "GET"). The default value is "GET ". other HTTP request methods, such as PUT and DELETE, can also be used, but only some browsers support.
Timeout	Number	Set the request timeout time (MS). This setting overwrites the global setting.
Async	Boolean	(Default: true) by default, all requests are asynchronous requests. To send synchronous requests, set this option to false. Note, The browser is locked for Synchronous requests. Other operations can be performed only after the request is completed.
BeforeSend	Function	Before sending a request, you can modify the function of the XMLHttpRequest object. For example, adding a custom HTTP header. the XMLHttpRequest object is a unique parameter.
Cache	Boolean	(Default: true) New jQuery 1.4 function. setting this parameter to false will not load request information from the browser cache.
Complete	Function	Callback Function after the request is complete (called when the request succeeds or fails). Parameter: XMLHttpRequest object, success information string.
ContentType	String	(Default: "application/x-www-form-urlencoded") Content Encoding type when sending information to the server. The default value is applicable to most applications.
Data	Object, String	Data sent to the server will be automatically converted to the request string format. The GET request will be appended to the URL. view the description of the processDate option to disable automatic conversion. It must be in Key/Value format. If it is an array, jQuery automatically corresponds to the same name for different values.
DataType	String	Expected data type returned by the server. If this parameter is not specified, jQuery automatically returns responseXML or responseText Based on the MIME information of the HTTP package and serves as the callback function parameter. Pass, available value: "Xml": returns an XML document, which can be processed by jQuery. "Html": returns plain text HTML information, including script elements. "Script": returns plain text JavaScript code. Results are not automatically cached. "Json": Return JSON data. "Jsonp": JSONP format.
Error	Function	(Default: Automatic judgment (xml or html) This method will be called when a request fails. This method has three parameters: XMLHttpRequest object, error message, and (possibly) captured error object.
Global	Boolean	(Default: true) Whether to trigger a global AJAX event. Setting it to false will not trigger a global AJAX event, such as ajaxStart or ajaxStop. It can be used to control different Ajax events.
IfModified	Boolean	(Default: false) obtain new data only when the server data changes. Use the Last-Modified header of the HTTP packet to determine.
ProcessData	Boolean	(Default: true) by default, data sent is converted to an object (technically not a string) with the default content type "application/x-www-form-urlencoded ". If you want to send the DOM tree information or other information that does not want to be converted, set it to false.
Success	Function	Callback Function for successful request.

Ajax-related functions of jQuery

1. jQuery. ajax (options)

Note:

Set global AJAX default options.

Explanation:

Sometimes we want to set the default behavior of all Ajax properties on the page. Then we can use this function to set the options Option. Then, the default options of all Ajax requests will be changed.

　2. Global Ajax events

In the options parameter attribute in jQuery. ajaxSetup (options), there is a global attribute. The details are as follows:

Type: Boolean

Default Value: true

Determines whether to trigger a global Ajax event.

This attribute is used to set whether to trigger a global Ajax event. A global Ajax event is a series of events that accompany Ajax requests. The main events are as follows:

Major Events

Name	Description
AjaxComplete (callback)	Execute the function when the AJAX request is complete.
AjaxError (callback)	Execute the function when an error occurs in the AJAX request.
AjaxSend (callback)	Execute the function before sending an AJAX request
AjaxStart (callback)	Execute functions at the beginning of an AJAX request
AjaxStop (callback)	Execute the function at the end of the AJAX request
AjaxSuccess (callback)	Execute the function when the AJAX request is successful.