仅当添加另一个类时，将类添加到元素

Question

我知道这个问题可能有相似的重复项，但找不到解决方案。 我有一个带有3张幻灯片的滑块。 该插件是lightslider 。 我要实现的是，每当第三个滑块为当前滑块时，将一个CSS动画触发到一个元素上。 我注意到当前正在向当前幻灯片添加一个active类别，该幻灯片是当前可见的，如下面的屏幕截图所示。

所以我最初的想法是以下。 抓取特定元素，即svg-slide ，检查该元素是否具有active类，如果是，则添加触发动画的css类。

我的代码：

if ( $('.svg-slide').hasClass('active') ) {
   $('.svg-slide').addClass('fire-animation');
}

这个问题是，如果我错了，请纠正我，即页面加载时， active类位于第一张幻灯片上，因此代码已检查svg-slide没有active类，并且之后它什么也不做。 任何帮助，将不胜感激。

Answer 1

为什么不将getCurrentSlideCount方法与onAfterSlide事件一起使用？ 在更改幻灯片时，如果当前幻灯片是第三张幻灯片，则添加所需的类：

 var yourSlider = $('#lightSlider').lightSlider({ loop:true, pauseOnHover: true, onAfterSlide: function (el) { var currentSlide = el.getCurrentSlideCount(); if(currentSlide == 3){ //add your class $('.active').addClass('TESTING'); } else { $('.active').removeClass('TESTING'); } } }); 

我也给你开了个小提琴 。