如果项目数小于页面大小，请更改 Owl Carousel 选项答案

【问题标题】：Change Owl Carousel options if items count is smaller than page size如果项目数小于页面大小，请更改 Owl Carousel 选项
【发布时间】：2020-10-12 17:05:17
【问题描述】：

我有一个轮播，它的项目数并不总是相同，我想在项目数小于页面大小时更改轮播的一些选项。

这是我尝试过的，但它不起作用：

var owl = $('.owl-carousel');
owl.owlCarousel({
    items: 1,
    loop: true,
    rtl: true,
    autoplay: true,
    autoplayTimeout: 3000,
    autoplayHoverPause: true,
    dots: false,
    rewind: false,
    checkVisible: false,
    responsive: {
        500: {
            items: 2
        },
        700: {
            items: 3
        },
        900: {
            items: 4
        },
        1100: {
            items: 5
        },
        1300: {
            items: 6
        }
    },
    onInitialize: function (e) {
        if (e.item.count < e.page.size) {
            owl.data('owl.carousel').options.loop = false;
        }
    }
});

轮播正常工作，但回调函数不起作用，我在 chrome 的控制台中收到 Cannot read property 'options' of undefined 错误。

【问题讨论】：

标签： jquery owl-carousel

【解决方案1】：

responsive: {
        500: {
            items: 2,
            loop: function () {
                if ($(this).find('.owl-item').length > 2) {
                    return true;
                }
                return false;
            }
        },
        700: {
            items: 3,
            loop: function () {
                if ($(this).find('.owl-item').length > 3) {
                    return true;
                }
                return false;
            }
        },
        900: {
            items: 4,
            loop: function () {
                if ($(this).find('.owl-item').length > 4) {
                    return true;
                }
                return false;
            }
        },
        1100: {
            items: 5,
            loop: function () {
                if ($(this).find('.owl-item').length > 5) {
                    return true;
                }
                return false;
            }
        },
        1300: {
            items: 6,
            loop: function () {
                if ($(this).find('.owl-item').length > 6) {
                    return true;
                }
                return false;
            }
        }
    }

【讨论】：