🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
# jQuery ajax - getJSON() 方法 ## 实例 使用 AJAX 请求来获得 JSON 数据,并输出结果: ``` $("button").click(function(){ $.getJSON("demo_ajax_json.js",function(result){ $.each(result, function(i, field){ $("div").append(field + " "); }); }); }); ``` ## 定义和用法 通过 HTTP GET 请求载入 JSON 数据。 在 jQuery 1.2 中,您可以通过使用 JSONP 形式的回调函数来加载其他网域的 JSON 数据,如 "myurl?callback=?"。jQuery 将自动替换 ? 为正确的函数名,以执行回调函数。 注意:此行以后的代码将在这个回调函数执行前执行。 ### 语法 ``` jQuery.getJSON(_url_,_data_,_success(data,status,xhr)_) ``` | 参数 | 描述 | | --- | --- | | _url_ | 必需。规定将请求发送的哪个 URL。 | | _data_ | 可选。规定连同请求发送到服务器的数据。 | | _success(data,status,xhr)_ | 可选。规定当请求成功时运行的函数。额外的参数: _response_ - 包含来自请求的结果数据 _status_ - 包含请求的状态 _xhr_ - 包含 XMLHttpRequest 对象 | ### 详细说明 该函数是简写的 Ajax 函数,等价于: ``` $.ajax({ url: _url_, data: _data_, success: _callback_, dataType: json }); ``` 发送到服务器的数据可作为查询字符串附加到 URL 之后。如果 _data_ 参数的值是对象(映射),那么在附加到 URL 之前将转换为字符串,并进行 URL 编码。 传递给 _callback_ 的返回数据,可以是 JavaScript 对象,或以 JSON 结构定义的数组,并使用 $.parseJSON() 方法进行解析。 ### 示例 从 test.js 载入 JSON 数据并显示 JSON 数据中一个 name 字段数据: ``` $.getJSON("test.js", function(json){ alert("JSON Data: " + json.users[3].name); }); ``` ## 更多示例 ### 例子 1 从 Flickr JSONP API 载入 4 张最新的关于猫的图片: HTML 代码: ``` <div id="images"></div> ``` jQuery 代码: ``` $.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/>").attr("src", item.media.m).appendTo("#images"); if ( i == 3 ) return false; }); }); ``` ### 例子 2 从 test.js 载入 JSON 数据,附加参数,显示 JSON 数据中一个 name 字段数据: ``` $.getJSON("test.js", { name: "John", time: "2pm" }, function(json){ alert("JSON Data: " + json.users[3].name); }); ```