Owl-carousel 2 добавление слайдов через each
Привет!
Версии: owl.carousel.2.0.0-beta.2.4 jquery 2.2.4 У меня есть такая задача: //Тут выводится карусель <div id="car-photo-carousel" class="owl-carousel"></div> //Выбираю машину $('#car_id').on('change', function (e) { var car_id = e.target.value; //Инит карусели var carousel = $('#car-photo-carousel'); carousel.owlCarousel({ autoplay:true, autoplayTimeout:3000, autoplayHoverPause:true, items : 3, responsiveClass:true, nav:true, navText: ["<i class=\"fa fa-chevron-left\" aria-hidden=\"true\"></i>","<i class=\"fa fa-chevron-right\" aria-hidden=\"true\"></i>"], responsive:{ 0:{ items:1, nav:true }, 400:{ items:2, nav:true }, 768:{ items:3, nav:true } } }); //Тут делаю AJAX запрос, получаю список объектов $.post('/admin/getmodels/car', {car_id: car_id}, function (car) { if (car.photos.length > 0) { var counter = 0; //У объекта есть фотографии, они выводятся и добавляются через append к DIV, проверял все работает 100%, но мне надо добавить их к слайдеру, ок добавляем? $.each(car.photos, function (index, photo) { counter++; var content = '<img class="img img-responsive" src="' + photo.file + '"/>'; carousel.data('owlCarousel').addItem(content,0); }); } else { //Или одна картинка без слайдера carousel.append('<img class="cal-xs-8 img img-responsive" src="' + car.modelphoto[0].file + '"/>'); } }); }); Тут получается что добавление происходит в другой функции и он не видит уже инициированного слайдера? Получаю ошибку: Uncaught TypeError: carousel.data(...).addItem is not a function Как лучше сделать? :victory: |
AnimalInstinct,
строку 5 перенесите в строку 1. или в строках 37 , 41 укажите селектор а не используйте переменную |
Сделал так, но пока получаю ту же ошибку Uncaught TypeError: $(...).data(...).addItem is not a function
$( document ).ready(function() { $('#car-photo-carousel').owlCarousel({ autoplay:true, autoplayTimeout:3000, autoplayHoverPause:true, items : 3, responsiveClass:true, nav:true, navText: ["<i class=\"fa fa-chevron-left\" aria-hidden=\"true\"></i>","<i class=\"fa fa-chevron-right\" aria-hidden=\"true\"></i>"], responsive:{ 0:{ items:1, nav:true }, 400:{ items:2, nav:true }, 768:{ items:3, nav:true } } }); }); $('#car_id').on('change', function (e) { var car_id = e.target.value; $.post('/admin/getmodels/car', {car_id: car_id}, function (car) { if (car.photos.length > 0) { var counter = 0; $.each(car.photos, function (index, photo) { counter++; var content = '<img class="img img-responsive" src="' + photo.file + '"/>'; $('#car-photo-carousel').data('owlCarousel').addItem(content,0); }); } else { $('#car-photo-carousel').append('<img class="cal-xs-8 img img-responsive" src="' + car.modelphoto[0].file + '"/>'); } }); }); |
AnimalInstinct, строка 32
if(!$('#car-photo-carousel').data('owlCarousel')) $('#car-photo-carousel').owlCarousel({}); |
Не помогло
|
Часовой пояс GMT +3, время: 18:59. |