Jquery 使用活动类并在其他div中复制

我有一个使用jQuery.fullPage.js的幻灯片。我正在为各种幻灯片添加背景色，我试图从任何活动的幻灯片中获取背景色，并将其作为类添加到幻灯片的幻灯片控件中

我这样做的jQuery是：

$('.controlArrow').on('click', function () {
      $('.slide').each(function () {
          if ($(this).hasClass('black', 'active')) {
              $('.black.active').closest('.section').children('.controlArrow').addClass('black').removeClass('gray');
          } else {
              if ($(this).hasClass('gray', 'active')) {
                  $('.gray.active').closest('.section').children('.controlArrow').addClass('gray').removeClass('black');
              }
          }

      });
  });

问题是添加到箭头的类实际上并没有模仿活动幻灯片中的内容。因此，如果我有：

<div class="slide black active">

但这似乎没有帮助。我有一种感觉，我的逻辑是混乱的，但我没有看到它

我有一本书

为清晰起见添加屏幕截图。

---

它似乎正在工作，并将您想要的类添加到控件中。如果要将滑块的颜色放入控件中，则需要控制控件的边界颜色，而不是背景颜色，这就是为什么看不到颜色变化的原因。

试试看

jQuery(function ($) {
    var pepe = $.fn.fullpage({
        'css3': true,
        "verticalCentered": true
    });
    var colors = ['gray', 'black'], regex = new RegExp(colors.join('|'));
    $('.controlArrow').on('click', function () {
        var classes = $('.slide.active').prop('className');
        var color = classes.match(regex)[0];
        $('.controlArrow').removeClass(colors.join(' ')).addClass(color)
    });
});

---

演示：

对不起，你能再解释一下你在看什么吗for@ArunPJohny-我添加了一个屏幕截图来澄清。在

.slide

中激活的任何颜色在

.controlArrow

中也应该是相同的颜色。现在它是任意的。请尝试使用web inspector查看，一旦单击箭头，则

.controlArrow

的类与

中的
.active
不匹配。幻灯片

我在上面添加了一个屏幕截图以澄清问题。在

.slide

中激活的任何颜色在

.controlArrow

中也应该是相同的颜色。现在它是任意的。它似乎不匹配。如果使用web inspector查看，一旦开始单击箭头，

.controlArrow

的类与

中的
.active
不匹配。幻灯片

是的，很好！非常感谢。我喜欢你这样做。

 $('.controlArrow').click(function() {

jQuery(function ($) {
    var pepe = $.fn.fullpage({
        'css3': true,
        "verticalCentered": true
    });
    var colors = ['gray', 'black'], regex = new RegExp(colors.join('|'));
    $('.controlArrow').on('click', function () {
        var classes = $('.slide.active').prop('className');
        var color = classes.match(regex)[0];
        $('.controlArrow').removeClass(colors.join(' ')).addClass(color)
    });
});