Показать сообщение отдельно
  #1 (permalink)  
Старый 12.11.2022, 12:20
Новичок на форуме
Отправить личное сообщение для Димол Посмотреть профиль Найти все сообщения от Димол
 
Регистрация: 05.04.2020
Сообщений: 8

Не работает скрипт вместе с ajax
Мне подсказали скрипт, который под постом выводит форму для ответа
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title></title>
    <style>
    a.answ{
    cursor: pointer;
    font-weight: bold;
    color: navy;
    }
    a.answ:hover{
    color: crimson;
    }
    .hid{
    display: none;
    }
    </style>
   <script>
   onload = function(){
   [...document.querySelectorAll('.question')].forEach(function(z){
   z.addEventListener('click', function(e){
   elem = e.target;
   if(elem.className == 'answ'){
   document.querySelector('[name="question_number"]')?.closest('p').querySelector('a').classList.remove('hid');
   document.querySelector('[name="question_number"]')?.closest('form').remove();
   const cln = document.querySelector('#tpl').content.cloneNode(true),
         whereTo = elem.closest('p');
         
         cln.querySelector('[name="question_number"]').value = elem.closest('div').querySelector('p').id;
         whereTo.append(cln);
         elem.classList.add('hid');
   }
   });
   });
   }
   </script>
  </head>
  <body>
    <template id="tpl">
      <form>
       <textarea name="message"></textarea>
       <input type="hidden" name="question_number" value="" />
       <input type="submit" name="submit_otv" value="Отправить" />
      </form>
    </template>  
    <div class="question">
    <p id="q1">Вопрос 1</p>
    <p><a class="answ">Ответ</a></p>
    </div>
    <div class="question">
    <p id="q2">Вопрос 2</p>
    <p><a class="answ">Ответ</a></p>
    </div>
    <div class="question">
    <p id="q3">Вопрос 3</p>
    <p><a class="answ">Ответ</a></p>
    </div>
    <div class="question">
    <p id="q4">Вопрос 4</p>
    <p><a class="answ">Ответ</a></p>
    </div>
    <div class="question">
    <p id="q5">Вопрос 5</p>
    <p><a class="answ">Ответ</a></p>
    </div>
  </body>
</html>

Само по себе всё работает. Смотрю на стр. aj_chat.php
Но если я загружаю страницу с помощью ajax, то при клике форма не появляется.

<a href="#" chat="999"> ССЫЛКА</a>

<div id="men"></div>
<script>
$(function(){
$('a[chat]').click(function(e){
e.preventDefault();
var id_chat = $(this).attr('chat');
$.ajax({
type: "POST",
url: "aj_chat.php",
data: "id_chat="+id_chat,
cache: false,
success: function(responce){

$('#men').html(responce);
}
});
});
})
</script>

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

Последний раз редактировалось Димол, 12.11.2022 в 12:47.
Ответить с цитированием