Question

我有一个隐藏的li或者我需要创建一个

HTML

  <li class="instant_comment">
     <div class=image><a href='/channel'><img src='/fr43/prof.jpg' /></a></div>
       <div class=post>[What I comment]</div>
      </li>

 <form>
    <textarea id=textarea></textare>
    <input type=submit value='answer' id=Comment />
 </form>

因此，每当我撰写新评论并点击comment按钮时，它会将预先存在的li.instant_comment附加到#MyComments容器中。所以我不必通过表单传递我的个人资料图片，id_user，频道名称，令牌等。并附加它。

JQUERY 所以，像这样

  $("#comment").on("click",function(){

     $(".post")=$("#textarea").val();//add my content to the div
      $("#MyComments").append.(".instant_comment");//append this content to the ul

        });

有可能吗？

Answer 1

如果我理解你的问题，你会发现以下解决方案很有帮助。请注意，表单目前尚未提交，因为我已在函数中添加了e.preventDefault()。您可以使用AJAX提交表单。

$("#comment-form").on("submit", function(e){
  e.preventDefault();
  var textValue = $("#text-area").val();
  var myComment = "<li class='instant_comment'><div class=image><a href='/channel'><img src='/fr43/prof.jpg' /></a></div><div class=post>"+textValue+"</div></li>";
  $(this).after(myComment);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="comment-form">
    <textarea id="text-area"></textarea>
    <input type=submit value='answer' id="Comment" />
 </form>

希望这有帮助

Answer 2

您可以尝试从js创建li html并附加到父容器。

 var comment= $("#textarea").val();
 var newLi = "<li class='instant_comment'><div class='image'><a href='/channel'><img src='/fr43/prof.jpg' /></a></div><div class=post>" + comment + "</div></li>";
 $('#MyComments').append(newLi);

将包含数据的preexistent div附加到容器jquery

2 个答案: