Question

我正在尝试使用galleryview插件从rss Feed创建图库。当html内容静态地在页面中插件工作但是当我从rss动态生成html时调用插件似乎什么都不做。这是我正在使用的代码：

function getScrollerContent() {
    $.get('photos.rss', {}, function(xml) {
        var contentHtml = '';
        var filmStripHtml = '<ul class="filmstrip">';
        $('item', xml).each(function(i) {
            contentHtml += '<div class="panel">';
            var imgSrc = $(this).find('image').text();
            contentHtml += '<img src="' + imgSrc + '" />';
            contentHtml += '<div class="panel-overlay">';
            contentHtml += '<h2><a href="' + $(this).find('link').text() + '">' + $(this).find('title').text() + '</a></h2>';
            contentHtml += '<p>' + $(this).find('desc').text() + '</p>';
            contentHtml += '</div>';
            contentHtml += '</div>';
            filmStripHtml += '<li><img src="' + imgSrc + '" /></li>';
        });
        filmStripHtml += '</ul>';
        contentHtml += filmStripHtml;

        $('#photos').append(contentHtml);
    });

    $('#photos').galleryView({
        panel_width: 800,
        panel_height: 300,
        frame_width: 100,
        frame_height: 100
    });


}

$(getScrollerContent);

我做错了什么？

Answer 1

get调用是异步的，因此您需要在galleryview的回调函数末尾添加对get的调用，因为get会立即返回galleryview被调用（在空div上）：

$.get('photos.rss', {}, function(xml) {

    // rest of your code here

    $('#photos').galleryView({
      panel_width: 800,
      panel_height: 300,
      frame_width: 100,
      frame_height: 100
    });
});

jquery在动态内容上使用插件

1 个答案: