$ getJSON适用于jsfiddle,但不适用于远程

时间:2013-09-09 01:37:05

标签: jquery json undefined getjson flickr

我仍然不了解我尝试做的所有事情,因此我需要帮助解决破坏我的代码的问题。简而言之,我想获取包含照片信息的json结果,并将某些参数定位到我需要使用的变量中。

此代码只能在jsfiddle中找到。它显示Flickr照片的所有者用户名。

$.getJSON('http://api.flickr.com/services/rest/?&method=flickr.photos.getInfo&api_key=' + apiKey + '&photo_id=' + photoId + '&format=json&jsoncallback=?',
    function(data) {
        var photoOwner = $.parseJSON(JSON.stringify(data.photo.owner.username));
        $('#photoInfo').html(photoOwner);
});

当我将此代码放回我的JS文件的其余部分时,它会给出错误...

Uncaught TypeError: Cannot read property 'owner' of undefined

下面是我的JS文件的简化版本(减去apiKey和photoId变量)。

(function () {
  var s = document.createElement('script');
  s.setAttribute('src', 'http://jquery.com/src/jquery-latest.js');
  s.onload = function () {
jQuery.noConflict();
(function ($) {

    $.getJSON('http://api.flickr.com/services/rest/?&method=flickr.photos.getInfo&api_key=' + apiKey + '&photo_id=' + photoId + '&format=json&jsoncallback=?',
        function(data) {
            var photoOwner = $.parseJSON(JSON.stringify(data.photo.owner.username));
        $('#photoInfo').html(photoOwner);
    });

}(jQuery));
};
document.getElementsByTagName('body')[0].appendChild(s);
}());

所以我知道代码可以正常工作......当我把它放到我的JS文件中时,我只是不知道为什么它会停止工作。任何帮助,建议,解释或更好的方法都将非常感激。

1 个答案:

答案 0 :(得分:0)

我会尝试这样的事情......

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<script>
    var apiKey = <insert api key>,
        photoId = <insert photo id>;

    jQuery(function($) {
        // do all this in a document ready handler to ensure the
        // #photoInfo element is present

        $.getJSON('http://api.flickr.com/services/rest/?jsoncallback=?', {
            method: 'flickr.photos.getInfo',
            api_key: apiKey,
            photo_id: photoId,
            format: 'json'
        }).done(function(data) {
            var photoOwner = data.photo ? data.photo.owner.username : data.message;
            $('#photoInfo').html(photoOwner);
        }).fail(function(jqXHR, textStatus, errorThrown) {
            alert('Could not connect to flickr API');
        });
    });
</script>