javascript - 我的 ajax 代码显示评论时出现问题

Question

下面的代码是尝试使用ajax和php创建评论系统，这里php部分运行良好，评论已插入表中，但似乎我还没有掌握ajax。 Ajax 不起作用，除非我重新加载页面，否则不会显示注释。重新加载页面时，注释完美地出现在应有的位置，因此请帮助我修复我的 ajax 代码。

<?php
if(isset($_POST['content'])) {
$comment=strip_tags($_POST['content']);
$com = $db->prepare("INSERT INTO comments (comment,userto, userfrom, blog) VALUES (:comment, :userto, :userfrom, :blog)");
$com->execute(array(':comment'=>$comment,':userto'=>$userid,':userfrom'=>$uid,':blog'=>$blogId));   
}
?>


  <div class='db'>
  <table>
  <tr>
  <td>
  <img src='<?php echo $tar['profile_pic']; ?>' style='width:40px;height:40px;'/>
  </td>
  <td>
  <a href='<?php echo $tar['username']; ?>'><?php echo $tar['first_name'].' '.$tar['last_name']; ?></a>
  <p><?php echo $tar['comment']; ?></p>
  </td> 
  <td>
   <a href='#' id='<?php echo $tar['id']; ?>' class='delcomment' style='color:#555555;text-decoration:none;' title='Delete'>X</a>
   </td>
   </tr>
   </table>
        </div>

<script type="text/javascript" >
$(function() {
  $(".comment_button").click(function() {

    var test = $("#content").val();
    var dataString = 'content=' + test;

    if (test == '') {
      alert("Please Enter Some Text");
    } else {

      $.ajax({
        type: "POST",
        url: "",
        data: dataString,
        cache: false,
        success: function(html) {
          $(".db").show(html);
        }
      });
    }
    return false;
  });
});
</script>


<form method='post' name='form' action='' class='commentbox'>
<textarea cols='30' rows='2' name='content' id='content'></textarea><br />
<input type='submit' value='Comment' name='submit'class='comment_button'/>
</form>

Answer 1

您不需要使用变量dataString，并且需要为此更改$.ajax()函数:

var test = $("#content").val();

$.ajax({
    type: "POST",
    url: "",
    data: {
        content: test;
    },
    success: function(response) {
      $(".db").append(response);
    }
  });

更改以下行以避免页面刷新:

$(".comment_button").click(function(event) {
    event.preventDefault();

或将按钮的属性 type="submit" 更改为 type="button"，如下所示:

<button type='button' name='submit' class='comment_button'>Comment</button>

希望对你有帮助...