Я использую скользкие карусели в своем приложении, и я заметил, что, если я изменю размеры окна и перерисовываю скользкую карусель, я теряю события щелчка внутри карусели.Поэтому, чтобы исправить это, я обнаружил ловкое событие setPosition и использую его следующим образом:
$(".slick-event").off('setPosition').on('setPosition', function () {
yb.register.initializeEventsClickHandlers();
});
Одна небольшая проблема, с которой я столкнулся, заключается в том, что при первой загрузке страницысобытие вызывается.И когда я изменяю размер этой страницы, она вызывается несколько раз.~ 2-3 раза от тестирования.Я могу жить с этим, но это не кажется идеальным!
Теперь я столкнулся с более серьезной проблемой, у меня есть главная страница, где я буду использовать скользкую карусель 10x, так что теперь, когда я изменяю размер 'setPosition'событие вызывается много раз ~ 20 или больше, может быть.Это не идеально, поэтому я пытаюсь найти лучший способ повторно инициировать все события щелчков внутри моих каруселей на моей главной странице.Буду признателен за любую помощь!
Вот то, что у меня сейчас есть, в приведенном ниже коде я использую класс для запуска события 'setPosition', и я поместил класс на каждый скользящий элемент div.
scope.initializeSlickCarousels = function() {
$(".slick-event").off('setPosition').on('setPosition', function() {
yb.register.initializeEventsClickHandlers();
});
for (var key in scope.mapData) {
var eventId = scope.mapData[key]['EventId'];
$("#slick-event-" + eventId).slick({
slidesToShow: 3
});
}
};
И мои события кликов выглядят примерно так
scope.initializeEventsClickHandlers = function() {
$(".instruct-button").off('click').on('click', function() {
// do some stuff
});
$(".join-button").off('click').on('click', function() {
// do some stuff
});
$(".student.carousel").off('slide.bs.carousel').on('slide.bs.carousel', function(e) {
// do some stuff
});
};
ОБНОВЛЕНИЕ - я следовал советам по этой ссылке SO здесь , и я изменил свои события, чтобы выглядеть так
scope.initializeEventsClickHandlers = function() {
$(document).off('click').on('click', ".instruct-button", function () {
// do some stuff
});
$(document).off('click').on('click', ".join-button", function () {
// do some stuff
});
$(document).off('slide.bs.carousel').on('slide.bs.carousel', ".student.carousel", function (e) {
// do some stuff
});
};
и после этого события изменения и команды запускаются после изменения размера, но теперь загрузочная карусель внутри скользкой карусели не скользит!Даже если я использую событие щелчка carousel '.student.carousel' вместо документа, я пробовал оба, но ничего не получалось.К вашему сведению - у меня есть загрузочная карусель внутри гладкой карусели.Может быть, я должен сделать это еще одна гладкая карусель !?пятно внутри пятно?