0

如果这是在错误的论坛上,这是我第一次在网站上道歉。

我正在尝试从我网站上的灯箱画廊的 flickr 集中提取图像。灯廊需要照片按以下方式编码:

<ul>
    <li data-type="media" data-url="FULL SIZE URL"></li>
    <li data-thumbnail-path="THUMBNAIL URL"></li>
</ul>

我想在我命名的 div 中插入照片<div id="test"><div>这是我在查阅 Flick API 常见问题并查看其他代码后制作的 javascript:

$(function () {

$.ajax({
    url: 'http://api.flickr.com/services/rest/',
    data: {
        format: 'json',
        method: 'flickr.photosets.getPhotos',
        api_key: 'MY KEY',
        photoset_id: 'THE SET I'M USING',
        per_page: '50'
    },
    dataType: 'jsonp',
    jsonp: 'jsoncallback'
}).done(function (data) {
    var gallery = $('#test'),
        url;
$.each(data.photoset.photo, function (index, photo) {
        url = 'http://farm' + photo.farm + '.static.flickr.com/' +
            photo.server + '/' + photo.id + '_' + photo.secret;
        $('<ul>')
            .append($('<li>').prop('data-url', url + '_b.jpg').prop('data-type', 'media'))
            .append($('<li>').prop('data-thumbnail-path', url + '_s.jpg'))
        .appendTo(gallery);
    }); 
});

目前,我将 javascript 放在我的 html 标题中,但是当我运行页面时 div 是空的。

我错过了什么?

谢谢!

更新 1:我错过了});js 代码末尾的 a 。谢谢@dfsq 现在我们已经附加了部分工作,但是 flickr 数据仍然没有被传递给 li 道具。这是当前插入的内容的片段

<ul>
  <li></li>
  <li></li>
</ul>

更新 2:通过将每个更改.prop.attr剩余的问题已解决....

4

1 回答 1

0

修正后的js如下:

$(function () {

$.ajax({
    url: 'http://api.flickr.com/services/rest/',
    data: {
        format: 'json',
        method: 'flickr.photosets.getPhotos',
        api_key: 'MY KEY',
        photoset_id: 'THE SET I'M USING',
        per_page: '50'
    },
    dataType: 'jsonp',
    jsonp: 'jsoncallback'
}).done(function (data) {
    var gallery = $('#test'),
        url;
$.each(data.photoset.photo, function (index, photo) {
        url = 'http://farm' + photo.farm + '.static.flickr.com/' +
            photo.server + '/' + photo.id + '_' + photo.secret;
        $('<ul>')
            .append($('<li>').attr('data-url', url + '_b.jpg').attr('data-type', 'media'))
            .append($('<li>').attr('data-thumbnail-path', url + '_s.jpg'))
        .appendTo(gallery);
    }); 
  });
});
于 2013-04-15T03:09:36.937 回答