Question

我正在使用jquery拉取petfinder api，但我是新手。我遇到问题，因为页面上没有任何内容。这是链接，你可以看到有数据

http://api.petfinder.com/pet.getRandom?key=b6ba5a567c1e4f543b3c8a4b7ae0cf76&shelterid=KY305&output=full&format=json

这是我在js文件中的代码。您可以看到我只是想在ID为1的大尺寸照片上添加说明并尝试拍照。

抱歉这样一个新手问题。不知道为什么它没有显示。这是我的测试网站

http://www.wpcreations.net/matt/petsearch.html

admins / users - 一旦我发现问题，我将删除实时链接和密钥。谢谢。

$(document).ready(function(){

    var petfinderAPI = "http://api.petfinder.com/pet.getRandom?format=json&key=b6ba5a567c1e4f543b3c8a4b7ae0cf76&callback?";

    var petfinderOPT ={

        animal:"dog",
        shelterid:"KY305",
        output:"basic",
        //format:"json"

    };


    function displayInfo(data){

        var infoHTML = '<ul>';
        $.each(data.pet,function(i, pets){
        infoHTML += '<p> ' +  pets.description + ' <p>';
        //infoHTML += '<img src = " ' + photo.options.media.photos.photo + '"></a><li>';
        });
        infoHTML += '</ul>';

        $('#petfinderInfo').html(infoHTML);

        }

    $.getJSON(petfinderAPI,petfinderOPT,displayInfo)
  .done(function(petApiData) { alert('Data retrieved!'); })
  .error(function(err) { alert('Error retrieving data!'); 
});


}); //end ready function

以下是pet finder api doc的一个片段 - 跨域支持（JSONP）

Petfinder API支持跨域JavaScript请求的JSONP。在进行任何JSON格式的请求时，可以添加回调参数以表示这是一个JSONP请求。 callback参数的值应该是唯一的字符串。

下面是使用jQuery的JSONP请求的基本示例。这里的回调=？需要查询字符串参数来指定它是JSONP调用。 jQuery将取代＆＃39;？＆＃39;在具有唯一时间戳值的查询字符串中（即＆＃39; jQuery110206092635430395603_1391456463806＆＃39;）。

$.getJSON('http://api.petfinder.com/my.method?format=json&key=12345&callback=?')
  .done(function(petApiData) { alert('Data retrieved!'; })
  .error(function(err) { alert('Error retrieving data!'); 
});

这是petfinder api的链接。我不确定您是否必须加入网站https://www.petfinder.com/developers/api-docs#request-format

Answer 1

谢谢，但我已经弄清楚出了什么问题并使用ajax来提取信息。你可以关闭这个答案，但这里有一些代码

<script type="text/javascript">
$(document).ready(function(){
    var url = 'http://api.petfinder.com/pet.getRandom?key=longkeygoeshere&shelterid=KY305&output=full&format=json';
    $.ajax({
        type : 'GET',
        data : {},
        url : url+'&callback=?' ,
        dataType: 'json',
        success : function(data) {              
            // stores result
            var result = '';

            var petfinder = data.petfinder;
            var infoHTML = '<ul>';
            infoHTML += '<li>';
            infoHTML += '<strong>Description</strong><br>';
            infoHTML += petfinder.pet.description['$t'];
            infoHTML += '</li>';

            infoHTML += '</li>';

            infoHTML += '</ul>';
            // return infoHTML;
            $('#petfinderInfo').html(infoHTML);

            // $('#petfinderInfo').html(petfinder.pet.description['$t']);
            // 
            console.log(petfinder);
        },
        error : function(request,error)
        {
            alert("Request: "+JSON.stringify(request));
        }
    });
});

</script>

Petfinder api和jquery

1 个答案: