1

Нужно добавить новый тег li с помощью jQuery так чтобы была и дата и имя и текст который ввел пользователь! Вот код:

$(document).ready(function() {
  $(document).on("click", "add-comment", function() {
    var form = $("form[name='form']");
    form.css("display", "block");
    $("#add-comment").replaceWith('form');

  });


  $(document).on("click", "input[name = 'send']", function() {
    var myName = $("input[name = 'myName']").val();
    var comment = $("textarea[name='comment']").val();
    var newDate = $('.date_comment').val();
    var newComment = $("<li class='comment-item'>" + "<p class='text_comment'>" +
      comment + "</p>" + "</li>").appendTo("#new");

  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<ul id="new">
  <li class="comment-item">
    <span class="name_comment">Боб</span>
    <span class="date_comment"> 17 июня 2017 год</span>
    <p class="text_comment">Привет</p>
  </li>
</ul>

<div class="container">
  <form name="form" id="form" action="#" method="post" onsubmit="return 
    false">
    <textarea id="textarea" name="comment" cols="30" rows="10"></textarea><br>
    <input type="submit" name="send" value="Добавить комментарий" id="done">
  </form>
  <a href="#" onclick="return false" id="add-comment"></a>
</div>

1 ответ 1

0

$(document).on('click', 'button.send', function(e) {
  e.preventDefault();
  var myName = $('input[name="myName"]').val();
  var newDate = $('input[name="newDate"]').val();
  var comment = $("textarea[name='comment']").val();
  $('ul#new').append('<li class="comment-item"><span class="name_comment">' + myName + '</span><span class="date_comment">' + newDate + '</span> <p class="text_comment">' + comment + '</p></li>');
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<ul id="new">
  <li class="comment-item">
    <span class="name_comment">Боб</span>
    <span class="date_comment"> 17 июня 2017 год</span>
    <p class="text_comment">Привет</p>
  </li>
</ul>

<div class="container">
  <form>
    <input type="text" name="myName" placeholder="Имя" /><br />
    <input type="text" name="newDate" placeholder="Дата" /><br />
    <textarea name="comment" cols="30" rows="10" placeholder="Комментарий"></textarea><br />
    <button class="send">Добавить комментарий</button>
  </form>
</div>

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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