@moiseev1788

Как по клику добавить класс?

На странице есть блок комментарий, по нажатию на кнопку ответить нужно показать форму, где будет вводиться ответ, если форма показана и пользователь нажал на другом комментарии кнопку ответить, активную форму нужно скрыть и показать в другом месте. Как это можно сделать?

<div class="comment">
  <div class="comment-item">
    <div class="comment-item__text">Комментарий</div>
    <div class="comment-item__reply">Ответить</div>
    <div class="comment-item__form">
      <form action="">
        <textarea name="" id="" cols="30" rows="5" class="" placeholder="Ваш комментарий"></textarea>
      </form>
    </div>
  </div>
  <hr>
  <div class="comment-item">
    <div class="comment-item__text">Комментарий</div>
    <div class="comment-item__reply">Ответить</div>
    <div class="comment-item__form">
      <form action="">
        <textarea name="" id="" cols="30" rows="5" class="" placeholder="Ваш комментарий"></textarea>
      </form>
    </div>
  </div>
</div>


.comment {
  width: 100%;
}

.comment-item {
  max-width: 350px;
  margin: 0 auto;
  margin-bottom: 50px;
}

.comment-item__text {
  font-weight: bold;
  font-size: 20px;
  margin-bottom: 10px;
}

.comment-item__reply {
  margin-bottom: 15px;
  cursor: pointer;
}

.comment-item__form {
  display: none;
}
  • Вопрос задан
  • 29 просмотров
Решения вопроса 1
0xD34F
@0xD34F Куратор тега jQuery
$('.comment').on('click', '.comment-item__reply', function() {
  const $item = $(this).closest('.comment-item');
  $item.find('.comment-item__form').show();
  $item.siblings().find('.comment-item__form').hide();
});
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

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

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