Usage of Ajax asynchronous requests

Usage of Ajax asynchronous requests

First, we will introduce Ajax parameters:

Url: the address for sending the request (default: Current page address)

Data: the data sent to the server (in Key/Value format)

Type: Request Method ("POST" or "GET"). The default value is "GET ".

DataType:

Expected data type returned by the server. If this parameter is not specified, jQuery automatically determines Based on the MIME information of the HTTP package. For example, the xml mime type is recognized as XML. In 1.4, JSON will generate a JavaScript Object, and script will execute this script. The data returned by the server is parsed based on this value and passed to the callback function. Available value:

"Xml": returns an XML document, which can be processed by jQuery.
"Html": returns plain text HTML information. The script tag is executed when the dom is inserted.
"Script": returns plain text JavaScript code. Results are not automatically cached. Unless the "cache" parameter is set. ''' Note: ''' during remote requests (not in the same domain), all POST requests will be converted to GET requests. (Because the script tag of DOM will be used for loading)
"Json": Return JSON data. (Recommended)
"Jsonp": JSONP format. When calling a function in the form of JSONP, such as "myurl? Callback =? "Will jQuery be replaced automatically? For the correct function name to execute the callback function.

 

"Text": returns a plain text string.

Succes: callback function after successful request

 

 

1 $. ajax () method (recommended)

 

 

$ (". Del "). click (function () {var vedio_this = $ (this ). closest ("tr"); var vedio_id = $ (this ). closest ("tr "). attr ("id"); if (confirm ("cannot be restored after deletion. Are you sure you want to delete it? ") {$. Ajax ({url: $ ("# url "). val () + "/del_vedio", // The address for sending the request (default: Current page address) data: {// The data vedio_id: vedio_id} sent to the server, type: "POST", // request method. The method obtained by the backend server is $ _ POST ["vedio_id"]. Note: The default value is GET dataType: "json ", // The returned data type is json success: function (data) {// The callback function if (data. code = "a") {vedio_this.remove (); alert ("deleted successfully");} else {alert ("failed to delete ");}}});}});

 

 

The returned function after the request is successful can also be replaced by $. ajax (). done (function:

 

$ (". Del "). click (function () {var vedio_this = $ (this ). closest ("tr"); var vedio_id = $ (this ). closest ("tr "). attr ("id"); if (confirm ("cannot be restored after deletion. Are you sure you want to delete it? ") {$. Ajax ({url: $ ("# url "). val () + "/del_vedio", // The address for sending the request (default: Current page address) data: {// The data vedio_id: vedio_id} sent to the server, type: "POST", // request method. The method obtained by the backend server is $ _ POST ["vedio_id"]. Note: The default value is GET ype: "json" // The returned data type is json }). done (function (data) {// callback function if (data. code = "a") {vedio_this.remove (); alert ("deleted successfully");} else {alert ("failed to delete ");}});}});

2 $. post (url, [data], [callback], [datatype]) is a simple POST Request function to replace complex $. ajax. You can call the callback function when the request is successful. To execute a function when an error occurs, use $. ajax.

 

NOTE: If datatype is not written, the default value is txet.

 

$ (". Del "). click (function () {var vedio_this = $ (this ). closest ("tr"); var vedio_id = $ (this ). closest ("tr "). attr ("id"); if (confirm ("cannot be restored after deletion. Are you sure you want to delete it? ") {$. Post ($ ("# url "). val () + "/del_vedio", // url {vedio_id: vedio_id}, // data function (data) {// callback function if (data. code = "a") {vedio_this.remove (); alert ("deleted successfully");} else {alert ("failed to delete ");}}, "json" // dataType );}});

 

3 $. get (url, [data], [callback], [datatype]), which is a simple GET request function to replace complex $. ajax. You can call the callback function when the request is successful. To execute a function when an error occurs, use $. ajax.

Note: to receive data in the background, use $ _ GET [""]

 

$ (". Del "). click (function () {var vedio_this = $ (this ). closest ("tr"); var vedio_id = $ (this ). closest ("tr "). attr ("id"); if (confirm ("cannot be restored after deletion. Are you sure you want to delete it? ") {$. Get ($ ("# url "). val () + "/del_vedio", // url {vedio_id: vedio_id}, // data function (data) {// callback function if (data. code = "a") {vedio_this.remove (); alert ("deleted successfully");} else {alert ("failed to delete ");}}, "json" // dataType );}});

 

4 $. getJSON (url, [data], [callback]) method Note: data is optional.

5 $. getScript (url, [callback]) method Note: callback can load and execute a JavaScript file through an http get request.

 

$.getScript("test.js", function(){  alert("Script loaded and executed.");});

 

6 $. load (url, [data], [callback]) method Note: data and callback can be used to load remote HTML file code and insert it into the DOM.

For example:

$("#feeds").load("feeds.html");

 

Another example is:

 

 $("#feeds").load("feeds.php", {limit: 25}, function(){   alert("The last 25 entries in the feed have been loaded"); });