如何让JSONP与jQuery一起使用?

时间:2013-07-02 16:18:36

标签: javascript jquery json jsonp

我正在尝试从Flickr API获取一些JSONP来使用:

http://jsfiddle.net/SRc98/

$.getScript('http://api.flickr.com/services/feeds/photos_public.gne?format=json&tags=cats', function(data, textStatus, jqxhr) {
    alert(data);
});

警报提供undefined,控制台显示:

Uncaught ReferenceError: jsonFlickrFeed is not defined

Flickr API响应是否有问题,或者有没有办法让它在工作中运行?

http://api.flickr.com/services/feeds/photos_public.gne?format=json&tags=cats

2 个答案:

答案 0 :(得分:3)

尝试使用jQuery.getJSON()代替:

$.getJSON('http://api.flickr.com/services/feeds/photos_public.gne?format=json&tags=cats&jsoncallback=?', function(data, textStatus, jqxhr) {
    alert(data);
});

您可以看到Online API Documentation Demo

修改

现场演示

// Set the flicker api url here
var flickerAPI = "http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?";

// Set the tag display options
var options = {
  tags: "cats",
  format: "json"
};

// Get json format data using $.getJSON()
$.getJSON(flickerAPI, options)
  .done(OnApiCallSuccess)
  .fail(OnApiCallError);

// Api call success callback function
function OnApiCallSuccess(data) {
  $.each(data.items, function(i, item) {
    $("<img>").attr("src", item.media.m).appendTo("#images");

    // Load only the first 6 images for demo
    if (i === 6) return false;
  });
}

// Api call error callback function
function OnApiCallError(jqxhr, textStatus, error) {
  var err = textStatus + ", " + error;
  console.log("Request Failed: " + err);
}
img {
  height: 100px;
  float: left;
  padding: 0 10px 10px 0;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<div id="images"></div>

答案 1 :(得分:0)

JQuery的getScript硬编码数据参数为null,并自动评估检索到的脚本 我认为文档是错误的。好的是你可能只是想要评估脚本而且根本不需要回调。

对于你的案件: -
从您的URL中检索到的脚本确实正在评估,但目前没有function jsonFlickrFeed()的定义。这就是显示未定义错误的原因。 您需要包含一些具有其定义的JS文件。