猫头鹰旋转木马-仅用一个点滑动多个旋转木马 [英] Owl Carousel - Slide multiple carousels with just one dots carousel slide

问题描述

我有两个想要使用的轮播，它们都具有相同数量的物品，所以没问题，但是我只想要一个导航dots，并且能够使用相同的触发条件来触发多个dots属性.

I have two carousels that I wanted to used, they both have the same amount of items so it will be fine, BUT I want only to have one navigation dots and be able to trigger multiple dots with the same attributes.

$('.div_main .owl-dots').each(function(index) {
    $(this).attr('data-index','dot-'+index);
});
$('.owl-dots[data-index="dot-0"] button').each(function(index) {
    $(this).attr('data-index','dot-'+index);
});
$('.owl-dots[data-index="dot-1"] button').each(function(index) {
    $(this).attr('data-index','dot-'+index);
});
$('.div_main .owl-dot').click(function(e) {
    e.preventDefault();
    var idx = $(this).data('index');



    $('.div_main').each(function() {
        $(this).find('button.owl-dot').eq(0).attr('data-index',idx).click();
    });
});

第一个功能是获取所有猫头鹰点并添加index属性以了解哪个.第二个和第三个是使它们相同的对象，例如，如果此button具有data-index="dot-0"，另一个owl.dots也将是button[data-index="dot-0"]，那么这一次，我要么要触发其中之一，要么就发现另一个button具有相同的data-index，但是会导致错误.

The first function is to get all owl-dots and add index attribute to know which is which. the second and third one are the to make them the same, like if this button has data-index="dot-0" also the other owl.dots will be button[data-index="dot-0"] so this time, I either want to trigger one of them and ill just find the other button with the same data-index, but It causes error.

  Uncaught RangeError: Maximum call stack size exceeded

我认为我的第四个功能有问题.或者是否存在某个实例，一个dots将使用owl-carousel触发另一个dots?

I think there is something wrong with my fourth function. Or is there any instances that one dots will trigger other dots with owl-carousel?

推荐答案

此点击处理程序:

$('.div_main .owl-dot').click(function(e) {
  e.preventDefault();

  if(!$(this).is(".active"){
   var idx = $(this).data('index');
   $("[data-index='"+idx+"']").not(this).click();
  }
});

注意.not(this)！

您有此错误，主要是因为您在哪里说:«单击我，请单击我.»...这会导致最大的堆栈错误.

You had the error, basically because you where saying: «On click on me, click on me.»... Which cause the maximum stack error.

因此，还要检查该点是否已激活将停止无限循环.

So also checking if the dot already is active will stop the infinite looping.

这篇关于猫头鹰旋转木马-仅用一个点滑动多个旋转木马的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！