Home  >  Article  >  Web Front-end  >  There are several types of jquery asynchronous requests

There are several types of jquery asynchronous requests

WBOY
WBOYOriginal
2022-05-18 11:12:212094browse

There are 4 types of jquery asynchronous requests: 1. Ajax request, the syntax is "$.ajax({name:value,...})"; 2. Get request, the syntax is "$.get(url, pass Parameters, callback function, type)"; 3. getJSON request, supports cross-domain calls; 4. post request.

There are several types of jquery asynchronous requests

The operating environment of this tutorial: windows10 system, jquery3.2.1 version, Dell G3 computer.

There are several types of jquery asynchronous requests

The first Ajax request:

$.ajax(): is the core method.

$.ajax() method is a powerful and direct way to create Ajax requests. It is passed an options object as a parameter, and the properties of this options object configure all the instructions required to complete the request.

$.ajax() provides success and failure callback functions.

Syntax:

$.ajax({name:value, name:value, … })

Save data to the server, display information when successful

$.ajax({
   type: "POST",
   url: "some.php",
   data: "name=John&location=Boston",
   success: function(msg){
     alert( "Data Saved: " + msg );
   }
});

Comments:

type: (default: "GET"), request Method ("POST" or "GET") Other request methods are only supported by some browsers.

url: (Default current page address) The address to send the request.

data: stored data.

success: Called after the request, the returned data and the string containing the success code are transferred.

Function() needs to store the global variables declared on the controller side

The second $.get() request:

Syntax:

$.get(url address, parameter passed by param, callback function, return value type)

Note:

Parameters: optional;

Return value type: The type can be automatically matched according to the data (generally can be omitted)

(via remote HTTP GET request loads information. This is a simple GET request function to replace the complex $.ajax. The callback function can be called when the request is successful. If you need to execute the function when an error occurs, use $.ajax.)

Description:

Display test.php return value (HTML or XML, depending on the return value).

jQuery code:

$.get("test.php", function(data){
          alert("Data Loaded: " + data);
});

Third $.post() request:

Syntax:

$.post (url address, parameters passed by param, callback function, return value type)

Note:

Parameters: Optional;

Return value type: The type can be automatically matched according to the data (generally can be omitted)

(Load information through remote HTTP POST request)

Description:

Output results from the requested page test.php (HTML or XML, depending on what is returned):

jQuery Code:

$.post("test.php", function(data){
          alert("Data Loaded: " + data);
          });

The fourth $.getJSON() request:

##$.getJSON() is specifically Set up for ajax to obtain json data, and supports cross-domain calls.

Note: JSON is an ideal data transmission format. It can be well integrated with JavaScript or other host languages ​​and can be used directly by JS.

Syntax:

$.getJSON(url address, parameter passed by param (optional), callback function)

(Load JSON data through HTTP GET request)

jQuery Code:

$.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?tags=cat&tagmode=any&format
=json&jsoncallback=?", function(data){
  $.each(data.items, function(i,item){
    $("<img / alt="There are several types of jquery asynchronous requests" >").attr("src", item.media.m).appendTo("#images");
    if ( i == 3 ) return false;
  });
});

Note: The

$.getJSON() request is different from the first three. What is returned in the controller is not Content but It is a code in JSon format

There are several types of jquery asynchronous requests

Related video tutorial recommendations:

jQuery video tutorial

The above is the detailed content of There are several types of jquery asynchronous requests. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn