0

Имеется вот такая структура HTML + JQ кода.

 $(document).ready(function() {
      $('.m\\.catalog\\.personal-card\\.head').click(function() {
              $(this).toggleClass('active');
      });
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="m.catalog.personal-card.block BR(18)" notes="Описание">
                <div class="m.catalog.personal-card.head FS(26)" notes="Название блока">
                    <h3>Описание</h3>
                    <div class="m.catalog.personal-card.btn-view BR(18)"></div>
                </div>
                <div class="m.catalog.personal-card.body" notes="Контент блока">
                    Lorem ipsum dolor sit amet consectetur, adipisicing elit. Blanditiis magni magnam, tempora voluptatibus illum earum aperiam tempore unde cumque temporibus vel perferendis ut error omnis, ratione autem ab quidem tenetur.
                </div>
        </div>

JQ Код добавляет класс active для класса m.catalog.personal-card.head

Вот, как можно сделать что-бы добавлялся класс active для класса m.catalog.personal-card.body. Фактически нужно узнать индекс класса m.catalog.personal-card.head и присвоить класс active для класса m.catalog.personal-card.body.

Вот код которые берёт индекс класса при клике:

            $('.m\\.catalog\\.personal-card\\.head').click(function() {
                $('.m\\.catalog\\.personal-card\\.head').index( this );
            });

Помогите продолжить код. Фактически есть всё (но это не точно), но плохо владею JQ - чтобы это все реализовать!

1
  • 2
    Note: Точки в классе вместо _ или -, прям плохая идея... 7 ноя 2019 в 8:44

1 ответ 1

2
$('.m\\.catalog\\.personal-card\\.head').click(function() {
    let b = $(this).parent().children('.m\\.catalog\\.personal-card\\.body');
    b.toggleClass('active');
});

или

$('.m\\.catalog\\.personal-card\\.head').click(function() {
    let b = $(this).next('.m\\.catalog\\.personal-card\\.body');
    b.toggleClass('active');
});

или (если после элемента .head не будет элементов кроме .body)

$('.m\\.catalog\\.personal-card\\.head').click(function() {
    let b = $(this).next();
    b.toggleClass('active');
});
1
  • не подскажете ли литературу или источники, для более углубленного изучения JQ ? 7 ноя 2019 в 17:32

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими пользовательским соглашением, политикой конфиденциальности и политикой о куки

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