Summary of the usage of $.post and $.ajax in Jquery

  • 2020-06-03 05:47:31
  • OfStack

Jquery $.ajax

jQuery. ajax(options) : Remote data is loaded via HTTP requests, which is the underlying AJAX implementation of jQuery. Easy to use high-level implementation see $.get, $.post, etc.

$.ajax () returns the XMLHttpRequest object it created. In most cases you don't need to manipulate the object directly, but in special cases it can be used to manually terminate the request.

Note: If you specify the dataType option, make sure the server returns the correct MIME information (e.g. xml returns "text/xml"). The wrong MIME type can cause an unpredictable error. See Specifying the Data Type for AJAX Requests.

When set to datatype type 'script', all remote (not in the same domain)POST requests are converted back to GET mode.

$.ajax () has only one argument: the parameter key/value object, which contains information about each configuration and callback function. See below for detailed parameter options.

In jQuery 1.2, you can load JSON data across domains and use it with the data type set to JSONP. When a function is called in JSONP form, such as "myurl? callback = & # 63;" jQuery will automatically replace # #63; To execute the callback function for the correct function name. When the data type is set to "jsonp", jQuery automatically invokes the callback function. (I don't know much about that.)

jquery ajax Parameter list:

url(String)

(Default: current page address) The address at which the request was sent.

type(String)
Request mode (there are two arguments "POST" and "GET"), default is "GET". Note: Other HTTP request methods, such as PUT and DELETE, are also available, but only partially supported by browsers.

timeout(Number)

Sets the request timeout in milliseconds. This setting overrides the global Settings.

async(Boolean)

(Default: true) When set to true all requests are asynchronous. If you need to send synchronous requests, set this option to false. Note that the synchronous request locks the browser and the user must wait for the request to complete before performing any other actions.

beforeSend(Function)

Functions of the XMLHttpRequest object can be modified before sending the request, such as adding custom HTTP headers. The XMLHttpRequest object is the only argument to 1.


function(XMLHttpRequest){
 this; // the options for this ajax request
}

cache(Boolean)
Whether to set the request result cache (default: true), false will not load the request information from the browser cache, note that it is better to set it to false at the beginning of development, otherwise it is not convenient for debugging.

complete(Function)

The callback function after the request completes (it is called on success or failure). Parameters: XMLHttpRequest object, success information string.


function(XMLHttpRequest,textStatus){
 this;//theoptionsforthisajaxrequest
}

contentType(String)

(Default: "application/ ES126en-ES127en-ES128en-ES129en ") Content encoding type when sending a message to the server. The default values are suitable for most applications.

data(Object,String)

Data sent to the server. Will be automatically converted to request string format. GET requests will be appended after URL. See the processData option description to disable this automatic conversion. Must be in Key/Value format. If it is an array, jQuery will automatically correspond to the same name for different values. For example {foo:["bar1", "bar2"]} convert to ' & foo=bar1 & foo = bar2 '.

dataType(String)

Defines the data type returned by the server. If not specified, jQuery will automatically return responseXML or responseText based on MIME package HTTP information and pass it as a callback function argument. Available values:
"xml": returns data in XML format that can be processed by jQuery.
"html": returns plain text data in HTML format; Can contain script elements.
"script": returns plain text JavaScript code. Results are not automatically cached.
"json": Returns JSON data.
"jsonp": JSONP format. When a function is called in JSONP form, such as "myurl? callback = & # 63;" jQuery will automatically replace ? To execute the callback function for the correct function name.

error(Function)

This method is called when the request fails (default: automatic judgment (xml or html). This method takes three arguments: an XMLHttpRequest object, an error message, and (possibly) a captured error object.


function(XMLHttpRequest,textStatus,errorThrown){
 // Under normal circumstances textStatus and errorThown Only one 1 A value
 this;//theoptionsforthisajaxrequest
}

global(Boolean)

Whether the global AJAX event is triggered (default: true). Setting it to false will not trigger global AJAX events such as ajaxStart or ajaxStop. Can be used to control different Ajax events

ifModified(Boolean)

(default: false) retrieves new data only when server data changes. Use the HTTP package Last-ES216en header information to determine.

processData(Boolean)

Set the format of the message sent (default: true). When set to true, the data sent will be converted to an object (not technically a string) to match the default content type "application/ ES226en-ES227en-ES228en-ES229en ". If you want to send DOM tree information or other information you do not want to convert, set it to false.

success(Function)

Callback function after successful request. This method takes two arguments: the server returns data and returns status


function(data,textStatus){
 //datacouldbexmlDoc,jsonObj,html,text,etc...
 this;//theoptionsforthisajaxrequest
}

The following is an example to explain the specific usage of this method in 1:


$.ajax({ 
  type:'get', 
  url:'http://www.www.daimajiayuan.com/rss', 
  beforeSend:function(XMLHttpRequest){ 
    //ShowLoading(); 
  }, 
  success:function(data,textStatus){ 
    $('.ajax.ajaxResult').html(''); 
    $('item',data).each(function(i,domEle){ 
      $('.ajax.ajaxResult').append('<li>'+$(domEle).children('title').text()+'</li>'); 
    }); 
  }, 
  complete:function(XMLHttpRequest,textStatus){ 
    //HideLoading(); 
  }, 
  error:function(){ 
    // Request error handling  
  } 
}); 

More specific jquery ajax instructions please see here: http: / / www w3school. com. cn/jquery/ajax_ajax asp

post $.post

jQuery.post(url, [data], [callback], [type]) : Use POST to make asynchronous requests
jquery $.post method parameter list (description) :
url (String) : The URL address to send the request.
data (Map) : (optional) Data to be sent to the server in the form of an Key/value key-value pair that can be placed in url.
callback (Function) : (optional) callback function on successful load (this method can only be called if Response returns to success).

type (String) : (optional) Data type requested by the client (JSON,XML, etc.)

This is a simple POST request function instead of the complex $.ajax, which calls the callback function when the request is successful. If you need to execute the function in case of an error, use $.ajax.
Here is a simple example code using $.post:


$.post( 
  'http://www.daimajiayuan.com/ajax.php', 
  {Action:"post",Name:"lulu"}, 
  function(data,textStatus){ 
    //data Can be xmlDoc,jsonObj,html,text, , etc. . 
    //this;// this Ajax Please refer to the requested option configuration information jQuery.get() When it comes to the this 
    alert(data.result); 
  }, 
  "json"// The return format of the request is set here "json" 
); 

If you set the format of the request to "json", at this point you do not set Response back to Response. ContentType = "application/json"; You will not be able to capture the returned data.

Note that in the above example alert(data.result); Since Accept is set to "json", the returned data is an object, so there is no need to use eval() to convert to an object.

This is the end of this article, I hope you enjoy it.


Related articles: