A brief discussion on the ajax method in jQuery (example code)

I often use the ajax method parameters in jquery at work, but I always can’t remember it and often have to check the documentation, so I wrote this article today to summarize it for future reference. At the same time I also share it with everyone, if you need it, you can take a look.

1.url:

is required to be a String type parameter, (default is the current page address) to which the request is sent.

2.type:

Requires parameters of String type, and the request method (post or get) defaults to get. Note that other http request methods such as put and delete can also be used, but are only supported by some browsers.

3.timeout:

Requires a Number type parameter and sets the request timeout (milliseconds). This setting will override the global setting of the $.ajaxSetup() method.

4.async:

Requires Boolean type parameters. The default setting is true. All requests are asynchronous requests. If you need to send synchronous requests, set this option to false. Note that a synchronous request will lock the browser, and the user must wait for the request to complete before other operations can be performed.

5.cache:

requires parameters of Boolean type, the default is true (when dataType is script, the default is false), setting it to false will not Load request information from browser cache.

6.data:

Requires parameters of type Object or String, data sent to the server. If it is not a string, it will be automatically converted to string format. The get request will be appended to the url. To prevent this automatic conversion, check the processData option. The object must be in key/value format, for example {foo1:"bar1",foo2:"bar2"} is converted to &foo1=bar1&foo2=bar2. If it is an array, JQuery will automatically assign the same name to different values. For example, {foo:["bar1","bar2"]} is converted to &foo=bar1&foo=bar2.

7.dataType:

Requires parameters of String type, expected data type returned by the server. If not specified, JQuery will automatically return responseXML or responseText based on the http package mime information and pass it as a callback function parameter. The available types are as follows:
xml: Returns an XML document that can be processed with JQuery.
html: Returns plain text HTML information; the included script tag will be executed when inserted into the DOM.
script: Returns plain text JavaScript code. Results are not automatically cached. Unless cache parameters are set. Note that when making remote requests (not under the same domain), all post requests will be converted into get requests.
json: Return JSON data.
jsonp: JSONP format. When calling a function using the SONP form, such as myurl?callback=?, JQuery will automatically replace the last "?" with the correct function name to execute the callback function.
text: Returns a plain text string.

8.beforeSend:

requires parameters of Function type. You can modify the function of the XMLHttpRequest object before sending the request, such as adding a custom HTTP header. If false is returned in beforeSend, this ajax request can be canceled. The XMLHttpRequest object is the only parameter.
Function (xmlhttprequest) {
this; // Call the options parameter passed during this AJAX request
}

## 9.com

#Requires parameters of Function type, callback function to be called after the request is completed (called when the request succeeds or fails). Parameters: XMLHttpRequest object and a string describing the successful request type. function(XMLHttpRequest, textStatus){ this; //The options parameters passed when calling this ajax request

}

10.success：

Requires parameters of Function type. The callback function called after the request is successful has two parameters.            (1) Data returned by the server and processed according to the dataType parameter. (2) Describe the string of the state.

FUNCTION (Data, TextStatus) {

// Data may be XMLDOC, JSONOBJ, HTML, Text, etc.

#11.error:

Requires parameters of Function type, the function to be called when the request fails. This function has three parameters, namely XMLHttpRequest object, error message, and captured error object (optional). The ajax event function is as follows:
function(XMLHttpRequest, textStatus, errorThrown){
Normally only one of textStatus and errorThrown contains information
this; //The options parameters passed when calling this ajax request
        }

12.contentType:

is required to be a String type parameter. When sending information to the server, the content encoding type defaults to "application/x- www-form-urlencoded". This default value is suitable for most applications.

13.dataFilter:

requires parameters of Function type, a function that preprocesses the original data returned by Ajax. Provide two parameters: data and type. data is the original data returned by Ajax, and type is the dataType parameter provided when calling jQuery.ajax. The value returned by the function will be further processed by jQuery.
           function(data, type)                                                                                                                                                                                                                                                                                      ; ##Requires parameters of Function type, a function that preprocesses the original data returned by Ajax. Provide two parameters: data and type. data is the original data returned by Ajax, and type is the dataType parameter provided when calling jQuery.ajax. The value returned by the function will be further processed by jQuery.
FUNCTION (data, type) {
// Back to the processing data
Return data;

}

11 15.global:

Requires parameters of Boolean type, defaults to true. Indicates whether to trigger the global ajax event. Setting to false will not trigger global ajax events, ajaxStart or ajaxStop can be used to control various ajax events.

16.ifModified:

is required to be a Boolean type parameter, and the default is false. Only get new data when server data changes. The basis for determining server data changes is the Last-Modified header information. The default value is false, which means header information is ignored.

17.jsonp:

requires parameters of String type and rewrites the name of the callback function in a jsonp request. This value is used to replace the "callback" part of the URL parameter in a GET or POST request such as "callback=?". For example, {jsonp:'onJsonPLoad'} will cause "onJsonPLoad=?" to be passed to the server.

18.username:

is required to be a String type parameter, used to respond to the username of the HTTP access authentication request.

19.password:

is required to be a String type parameter, which is the password used to respond to the HTTP access authentication request.

20.processData:

Requires a Boolean type parameter, the default is true. By default, the data sent will be converted to an object (technically not a string) to match the default content type "application/x-www-form-urlencoded". If you want to send DOM tree information or other information that you do not want to convert, set it to false.

21.scriptCharset:

Requires String type parameters, only when the dataType is "jsonp" or "script" during the request, and the type is GET Used to forcefully modify the character set (charset). Usually used when the local and remote content encodings are different.

Case code:

$(function(){
    $('#send').click(function(){
         $.ajax({
             type: "GET",
             url: "test.json",
             data: {username:$("#username").val(), content:$("#content").val()},
             dataType: "json",
             success: function(data){
                         $('#resText').empty();   //清空resText里面的所有内容
                         var html = ''; 
                         $.each(data, function(commentIndex, comment){
                               html += &#39;<div class="comment"><h6>&#39; + comment[&#39;username&#39;]
                                        + &#39;:</h6><p class="para"&#39; + comment[&#39;content&#39;]
                                         + &#39;</p></div>&#39;;
                         });
                         $(&#39;#resText&#39;).html(html);
                      }
         });
    });
});

The above is the detailed content of A brief discussion on the ajax method in jQuery (example code). For more information, please follow other related articles on the PHP Chinese website!