Form inside Owl Carousel version 1&2

Question

我正在 Owl 轮播中构建一个简单的表单，但我无法让它在他们的版本 2 上运行。

问题是当用户在第二个版本的输入类型中单击时，控制台日志给出错误：Uncaught TypeError: Cannot read 属性 'name' of undefined.

在第一个版本中一切正常。 Here is a fiddle for v1 我只是想知道是否有人可以看一下，我尝试使用 mouseDrag:false 但它不起作用。

And here is the link for version 2 代码如下：

$(document).ready(function () {
    var owl = $('.owl-carousel');
    owl.owlCarousel({
        items:1,
        mouseDrag:false
    });
    // Go to the next item
    $('.customNextBtn').click(function () {
        owl.trigger('next.owl.carousel');
    })
});

Answer 1

这个 post 已经超过 3 年了，但我遇到了同样的问题。我花了几个小时才找到解决方案，所以我想与任何可能感兴趣的人分享。

我不知道究竟是什么导致了这个错误，但我认为只要 focusout 事件被触发就会抛出这个错误。不幸的是，阻止 focusout 冒泡并没有解决我的问题。

浏览 GitHub 上的项目问题后，我发现 this article 昵称 "ghost" 的用户提出了一个解决方案。可以通过禁用输入的 onclick 和 onchange 事件来避免该问题。

这段代码对我有用：

$("#controls").on('click change', function(event) {
    event.stopPropagation();
});

其中 #controls 是 <div> 我所有表单控件的包装器

Form inside Owl Carousel version 1&2

Form inside Owl Carousel version 1&2

javascript

jquery

owl-carousel

owl-carousel-2