Owl Carousel 2 - 如何获得当前物品?

新手上路,请多包涵

我正在使用 Owl Carousel 2 开发一个网站。我只想检测前面显示的是哪个项目。

以前是这样的。 http://owlgraphic.com/owlcarousel/demos/owlStatus.html

 $(document).ready(function() {

  var owl = $("#owl-demo"),
      status = $("#owlStatus");

  owl.owlCarousel({
    navigation : true,
    afterAction : afterAction
  });

  function updateResult(pos,value){
    status.find(pos).find(".result").text(value);
  }

  function afterAction(){
    updateResult(".currentItem", this.owl.currentItem);
  }
});

但它是版本1的例子,在版本2中,上面的不行,按照官方文档好像应该用“info”。 http://owlcarousel.owlgraphic.com/docs/api-options.html#info

我试图弄清楚它,但没有额外的例子或文件。我也浏览了 .js 文件,但无法获取它。我想知道“信息”是否尚未实施。

我真的不想了解信息,只想获取当前项目的数据。

我也在下面尝试过这种方式,但它不能正常工作。你有任何可能的解决方案吗?

 var active = $("#owl-demo").find(".owl-item.active");
console.log(active.text());

原文由 stackgk 发布,翻译遵循 CC BY-SA 4.0 许可协议

阅读 469
1 个回答

我不能不回答就离开这里。你这样做。我也无法在文档中找到它。我深入研究了源代码。

 owl.on('changed.owl.carousel', function (e) {
    console.log("current: ",e.relatedTarget.current())
    console.log("current: ",e.item.index) //same
    console.log("total: ",e.item.count)   //total
})

更多信息:如果您希望此事件触发初始状态。您应该在初始化 owl 之前添加它们。像这样。

 var owl = $("#yourItem")
owl.on('changed.owl.carousel', function (e) {
    console.log("current: ",e.relatedTarget.current())
    console.log("current: ",e.item.index) //same
    console.log("total: ",e.item.count)   //total
})
// then init
owl.owlCarousel({settings})

原文由 atilkan 发布,翻译遵循 CC BY-SA 4.0 许可协议

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题