9

我在将内容加载到 owl carousel 2 时遇到问题。我正在尝试通过此功能获取新项目：

function loadDecisions(pageNumber) {
   $.ajax({
       url: globalURL,
       type: 'POST',
       data: {
           action: 'lw_infinite_scroll',
           loop_file: 'video',
           page_no: pageNumber,
           posts_per_page: postsPerPage
       },
       success: function(data) {
           $(".owl-stage").append(data);    
           owl = jQuery('.owl-carousel');

           count++;
           resizeStage();
       },
       error: function(e) {
       }
   });
   return false;
}

如果我像这样将新项目附加到 .owl-stage ，$(".owl-stage").append(data);我可以看到它们，但我不能滑动到它们。我认为 owlcarousel 认为仍然只有 5 个项目，即使我添加了更多。

如果我更改$(".owl-stage").append(data);为$(".owl-stage").html(data);. 然后显然旧内容消失了，但我可以滑动到新项目。

谁能建议我应该怎么做？我正在使用 owlcarousel 2.0.4。

4

2 回答 2

10

对我来说，接受的答案不起作用，但这个解决方案完成了工作：

$('.owl-carousel').owlCarousel().trigger('add.owl.carousel', 
                  [jQuery('<div class="owl-item">' + html +
                          '</div>')]).trigger('refresh.owl.carousel');

这是因为，至少在今天的 Owl Carousel v2 上需要一个 jQuery 对象来传递给“add”。

请参阅 Github 票#1170，Gurunave 对此进行了最佳解释。

于 2016-10-28T08:27:07.743 回答
5

不要在正在运行的轮播中使用 jQuery 添加项目。您应该add像这样使用该方法：

 $('.owl-carousel').owlCarousel('add', '<markup>').owlCarousel('refresh')

请注意，您需要为此进行最新开发：https ://github.com/OwlFonk/OwlCarousel2#building 。

于 2014-08-27T19:34:46.970 回答