Home > Web Front-end > JS Tutorial > body text

How to use jquery to implement ajax asynchronous request to return json data code details

伊谢尔伦
Release: 2017-07-21 14:47:53
Original
1797 people have browsed it

Jquery's asynchronous ajax request receiving and returning json data method is simple to set up. One is that the server handler returns json data, and the other is that the datatype of the ajax sending setting is set to jsonp format data or json format.

The code example is as follows:

$('#send').click(function () {
    $.ajax({
        type : "GET",
        url : "a.php",
        dataType : "jsonp",
        success : function (data) {
            $.each(data.items, function (i, item) {
                $("<img class=&#39;para&#39;/> ").attr("src", item.media.m).appendTo("#resText");
                if (i == 3) {
                    return false;
                }
            });
        }
    });
});
Copy after login

$.ajax method is as follows:

$.ajax({ 
   type: "POST",
   url:  ctxRoot+&#39;FolderAction!saveInformSetting.action&#39;,
   data: &#39;jsonStr=&#39; + inform_settingListStr,
   dataType: "json",
   complete: function(data){
       //在这里做些事情,假设返回的json数据里有name这个属性
       //有时候可以直接data.name或者data[&#39;name&#39;]去访问
       //但有时候,却要通过var jsonData = eval("("+data.responseText+")");才可以通过jsonData.name访问,而且这种情况下,需要是complete而不是success
   }
   });
$.ajax(options)
Copy after login

This is the most basic JQuery Ajax method, with only one parameter options, which contains Request information and callback function information. Parameter contents are all in the form of key:value pairs, and they are all optional.

The syntax is as follows:

$.ajax({options});
url: (string) The address to send the request, which can be a server page or a WebService action.
type: (string) Request method, POST or GET
data: (object) Data brought when sending a request to the server. It is in the form of key:value pair, such as: {name:"grayworm",sex:"male"}, if it is an array {works:["work1","work2"]}
dataType: (string) expected return type of data. xml, html, json, text, etc.
beforeSend: (Function) is triggered before sending an ajax request. If false is returned, the request will be canceled. If the asynchronous request needs to display gif animation, the visibility of the corresponding should be set here.

The above is the detailed content of How to use jquery to implement ajax asynchronous request to return json data code details. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
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
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template