Question

我一直很难将Owl Carousel添加到我们的应用程序中，并希望最新的2.0.0-beta.2.4版本会更容易，但我无法获得添加项目的基本功能并更新轮播工作。

我在这里做错了吗？

以下是我正在使用的代码：

$('#insert').on('click', function () {
    owl.trigger('add.owl.carousel', '<div class=\"item\"><p>D</p></div>').trigger('update.owl.carousel');
});

随着演示：

http://jsfiddle.net/52r9B/11/

文档（http://www.owlcarousel.owlgraphic.com/docs/started-welcome.html）似乎没有任何内容 - 除非我遗漏了一些明显的东西。

任何帮助都将不胜感激。

Answer 1

自上个月以来，OwlCarousel 2.0正在重新进行重新考虑。所以你使用的版本（2.0.0-beta.2.4）已经过时了。

以下是您演示的JS Bin。您的第一个错误是您已使用事件API添加新项而不将参数放入数组中：

// Right
$('.owl-carousel').trigger('add.owl.carousel', [first, second])
// Wrong
$('.owl-carousel').trigger('add.owl.carousel', first, second)

或者你也可以使用这样的插件方法：

$('.owl-carousel').owlCarousel('method', first, second, third, ...)

主要区别在于事件API仅提供所有公共方法的子集。

第二个错误是你试图通过事件API调用update，这是不可能的（见上文）。请改用refresh。

要查看您需要的build所需的最新开发，直到下一个pre-release即将到来。但请耐心等待，这仍然是测试版！

Answer 2

这是另一种方法，这个解决方案对我而言非常简单：

// appends an item to the end
$('.owl-carousel').owlCarousel('add', '<div>foo</div>').owlCarousel('update');
// adds an item before the first item
$('.owl-carousel').trigger('add.owl.carousel', [$('<div>bar</div>'), 0]).trigger('refresh.owl.carousel');

工作完美。

问候！

OwlCarousel2 - 添加项目+更新轮播

2 个答案: