0

Всем привет! Есть у меня подключенная owl-carusel, хочу чтобы она выводила динамически добавляемые товары из виджета со списком, т.е. чтобы li вставлялись на место div - как это можно сделать? Код привожу

$(".add_to_cart_button").click(function() {
  $('.cart_list li').each(function() {
    $('#owl-example').append('<div>' + $(this).html() + '</div>');
  });
});
/* Карусель */
<div class="container" id="carousel">
  <h3>ДОБАВЛЕННЫЕ БЛЮДА</h3>
  <div id="owl-example" class="owl-carousel">
    <div>
      <li>Товар 1</li>
    </div>
    <div>
      <li>Товар 2</li>
    </div>
    <div>
      <li>Товар 3</li>
    </div>
    <div>
      <li>Товар 4</li>
    </div>
  </div>
</div>

/* Виджет с корзиной */
<div class="widget_shopping_cart_content">
  <ul class="cart_list product_list_widget "></ul>
  <!-- end product list -->
</div>

1
  • неужели никто не знает как? хотя бы подскажите как все должно выглядеть: список ul с li поместить внутрь карусели по какому-то условию или наоборот? ведь, если li обернуть в divы, то список не будет списком или я ошибаюсь?
    – Вася
    16 июн 2015 в 19:45

1 ответ 1

2
$('.cart_list li').each(function(){
    $('#owl-example').append('<div>'+$(this).html()+'</div>');
    $(this).remove();
});

Это имелось в виду?

13
  • да, суть такая, но что-то все равно не получается.. Здесь между классами скорее всего нужна точка, ".cart_list.product_list_widget li", но все равно не работает..
    – Вася
    17 июн 2015 в 8:18
  • Не, точка не нужна. Я подправил. Достаточно было указать один класс. Я не обратил внимание, что там указано два класса. Скопировал сначала его, как один... В общем, по идее достаточно будет вот так: $('.cart_list li')
    – DES
    17 июн 2015 в 9:25
  • ну сначала вашу функцию нужно поставить на срабатывание при клике на кнопку "В корзину" + нужно создать обработчик на удаление также.
    – Maks Devda
    17 июн 2015 в 10:07
  • @Maks Devda, повесил событие на кнопку, но оно как-то неправильно отрабатывает - каждый раз пересчитывает заново и корзина пополняется в арифметической прогрессии
    – Вася
    17 июн 2015 в 11:52
  • 1
    @Вася вот такой код повесь $('#owl-example').append('<div>'+$('.cart_list li:last').html()+'</div>'); сори не посмотрел, там еще html() нужно было.
    – Maks Devda
    17 июн 2015 в 18:57

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.