如何根据输入值在另一个元素旁边添加元素

时间:2016-10-03 03:00:56

标签: javascript php jquery nodes

在评论系统中使用jquery或javascript ..我需要它;当我回答任何评论时,结果必须完全在相应的评论下显示

我遇到了问题,因为如果我使用容器的类来执行此操作,则会在每个注释下显示答案,如果我使用容器的id,则答案会始终显示在第一条注释旁边...所以我想你可以帮助我

这里是我正在使用的代码......

HTML

<div id="comment" class="comment">
  <button class="answer-button" id="answer-button"> Answer </button>
  <input class="comment-reply" id="comment-reply" type="text" readonly="readonly" value="'.$comment_id.'">
</div>

<div id="answer-container" class="answer-container"> </div>

<form class="replyform" method="post" action="actions/responder.php">
  <input type="text" id="reply-to" name="reply" readonly="readonly" value="">
</form>

PHP

<?php
    $success= '<div id="answer" class="answer">
    resulted data </div>';
?>

JS

$(document).ready(function() {
      //click answer button
      $(".answer-button").on("click", function() {
        var reply = $(".answer-button");
        //take the value of thecomment we want to answer
        var comment_id = reply.next('input#comment-reply').val();

        //now we write it in the form's input 
        document.getElementById("reply-to").value = comment_id;

        //now we go to submit the form
        $('.replyform').submit(function(event) {
          event.preventDefault();

          $.ajax({
            type: 'POST',
            url: $(this).attr('action'),
            dataType: 'JSON',
            data: $(this).serialize(),
            success: function(data) {

              //once we've sent data, compare the comment and form input values
              var value = $('.replyform').find('input#reply-to').val();
              var comment = $(".answer-button").next('input#comment-reply').val();

              //if they're equal, we show the answer under the corresponding comment
              if (comment = value) {

                if (data.success) {
                  $('.replyform').slideUp();
                  $('.comment').next('.answer').html(data.text);

                } else {
                  $('.replyform').find('#result').html(data.text);
                }
              }
            }
          })
          return false;
        });
      });

0 个答案:

没有答案