За последние 24 часа нас посетили 18222 программиста и 1577 роботов. Сейчас ищут 1074 программиста ...

Как сделать отображение контента по клику?

Тема в разделе "JavaScript и AJAX", создана пользователем гендаль серый, 30 сен 2023.

  1. гендаль серый

    гендаль серый Новичок

    С нами с:
    20 янв 2023
    Сообщения:
    53
    Симпатии:
    0
    а точнее нужно отображать ответы на комментарии..типа как в вк.
    пробовал на js делать нативном, показывает только первый ответ, а их там может быть и десятки же..
    пробовал на jquery, он вообще раскрывает сразу все ответы у всех комментариев...специалисты по js подскажите как надо..)

    Код (Javascript):
    1. let btnansw = document.querySelectorAll('.viewAnswer'),
    2.             answer_cont = document.querySelectorAll('.answer');
    3.  
    4.         for (let i = 0; i < answer_cont.length; i++){
    5.             btnansw[i].addEventListener('click', function(){
    6.                 answer_cont[i].style.display = 'block';
    7.                 this.style.display = 'none';
    8.             })          
    9.         }
    10.         $(document).ready(function(){
    11.         $('.viewAnswer').click(function(){
    12.             $('.answer').toggle();
    13.         });
     
  2. ADSoft

    ADSoft Старожил

    С нами с:
    12 мар 2007
    Сообщения:
    3.854
    Симпатии:
    748
    Адрес:
    Татарстан
    так при клике надо разворачивать не все которые с классом .answer а только в текущей ветке

    и вообще непонятно что вы делаете

    - выбираете все с классом .anwser
    - в цикле каждой кнопке с классом .viewAnswer навешиваете событие на клик которое открывает блок с каментом и скрывает видимо саму кнопку
    - далее уже на jq любой кнопке с классом viewAnswer вешаете на клик toggle на ВСЕ элементы класса answer
    капец месиво....

    Если такая структура html
    HTML:
    1. <button class="viewAnswer">Смотреть камент 1</button>
    2. <div class="answer">Comment 1</div>
    ну и
    Код (CSS):
    1. .answer{
    2.   display : none;
    3. }
    то код
    Код (Javascript):
    1. $(document).ready(function(){
    2.         $('.viewAnswer').click(function(){
    3.             $(this).next('.answer').toggle();
    4.         });
     
  3. гендаль серый

    гендаль серый Новичок

    С нами с:
    20 янв 2023
    Сообщения:
    53
    Симпатии:
    0
    у меня есть шаблон коммента к которому выводятся ансверы...ансверов может быть разное количество из базы данных к разным комментам..
    в блоке коммента есть кнопка показать-скрыть. нажимая по кнопке в этом же блоке коммента, появляются все ансверы для этого коммента, у ансверов дисплей нон в стилях стоит по умолчанию - это вы правильно поняли.
    --- Добавлено ---
    чет я долго уже сижу с этим делом ..)