@Loaderka

Как сделать клик на каждую кнопку без тысячи строк кода?

Первое фото - обычный вид, нужно чтобы при нажатии на "Know more" изменялся текст с фоном и появлялся крестик, как на втором фото. Привязал к айди первый блок, все работает классно, но возник вопрос - можно ли как-то остальные 5 сделать без создания 5 новых айди и прописывания функций? На дваче сказали привязать к классу, но с классом при нажатии, все блоки меняются, подскажите как правильно это делается, я начинающий.

5e1370b86805e631771861.png
5e1370b064b29994470190.png

Codepen - тут часть, касающаяся вопроса
Full - тут полная версия, с картинками и тд...
  • Вопрос задан
  • 706 просмотров
Решения вопроса 1
inkShio
@inkShio
$(function() {
  $(".services__btn").on("click", function(event) {
    var $this = $(this),
      servicesContent = $this.closest(".services__content");

    servicesContent.toggleClass("content__open");
    $this.toggleClass("services__btn-close");
  });
});


так попробуй
Ответ написан
Пригласить эксперта
Ответы на вопрос 2
jt3k
@jt3k
Фронтендер, люблю работать и получать удовольствия
Если начинающий, то прочитай про делегирование.
Суть там простая -- вешаешь один обработчик общему родителю, а внутри обработчика делаешь проверку 'если это кнопка, и если она имеет определённый класс', то делаешь то что нужно, а иначе не делаешь ничего

В жквери делегирование делается следующей конструкцией:
```
$('.общий-родитель').on('click', 'button.какой-то-дочерний-класс', event => {
// делаем какое-то действие
});
```
Ответ написан
@Karpion
Прописать всем объектам одну функцию, но с разными параметрами. И менять окно, соответствующее параметру.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы