Estoy usando Slick Slider como menú móvil. Los elementos en el control deslizante pulido alternan las pestañas de arranque.

 var $slider = $('.mobilenav .mobile-tabs .slider'); $slider.slick({ prevArrow: '<div class="slick-prev"><i class="fa fa-angle-left" aria-hidden="true"></i></div>', nextArrow: '<div class="slick-next"><i class="fa fa-angle-right" aria-hidden="true"></i></div>', infinite: false, slidesToShow: 3, slidesToScroll: 1, focusOnSelect: true, centerMode: true, centerPadding: 0, slickFilter : ':not(.hide-slide)' }); $slider.on('afterChange', function(event, slick, currentSlide, nextSlide) { $('.mobile-tab').removeClass('active'); $('.slick-current').find('a').addClass('active'); $('.slick-current').find('a').trigger('click'); }); <div class="mobilenav"> <div class="col-sm-12 mobile-tabs"> <div class="slider nav nav-pills"> <div> <a class="mobile-tab active" href="#tab1" data-toggle="tab"> <span class="fa fa-home"></span>Tab 1</a> </div> <div> <a class="mobile-tab" href="#tab2" data-toggle="tab"> <span class="fa fa-home"></span>Tab 2</a> </div> <div> <a class="mobile-tab" href="#tab3" data-toggle="tab"> <span class="fa fa-home"></span>Tab 3</a> </div> </div> </div> </div>

Todo funciona bien cuando haces clic en las pestañas directamente. Cuando usa las flechas anterior/siguiente para cambiar de pestaña es cuando ocurre el problema. Cuando se usan las flechas anterior/siguiente, el área de contenido de la pestaña para la pestaña no cambia. Parece que no está detectando el evento de clic en el elemento del menú que, cuando un usuario hace clic directamente en él, alterna el cambio de pestaña, pero cuando se llama activando un clic con jQuery después de que se usan las flechas anterior/siguiente no funciona.