javascript - 通过 AJAX 获取 PHP 数组

Question

我想用 AJAX 创建评论，我不知道这是否是我第一次做的正确方法。我已经在谷歌上搜索了几个小时，但我真的卡住了。

我想要实现的是在单击“评论”按钮后立即添加评论，而无需重新加载页面。

我不知道如何创建适合我需要的 JSON 数组。

这是我的javascript:

$(function(){
var userComments = $('.userComments');
var commentsUrl="commentsLoad.php";

$.ajax({
    type: 'GET',
    url: commentsUrl,
    dataType: "json",
    success: function(komentarji){
        //$.each ...
        userComments.append("output...");
    },
    error: function(e){
        console.log(e);
    }               
 });
});

这是我的 PHP:

include('config.php');
$comments=array();
$commentsQuery = "SELECT * FROM komentarji";
$result = $conn->query($commentsQuery);
    if($result->num_rows>0){
        while($row = $result->fetch_assoc()){
            $comments=array(                            
                            'id' => $row['id'],
                            'name' => $row['name'],
                            'text' => $row['text'],
                            'date' => $row['date'])
                            );                                      
            header('Content-type: application/json');
            echo json_encode($comments);
        }
    }

Answer 1

您所走的道路几乎是完美铺设的。除了以下几点需要注意:

1. 您应该在 while 循环之外回显 JSON 格式的结果数组。
2. 因为您在 ajax 调用中将 dataType 指定为 json(并告诉 jQuery 您期望从服务器返回 json) , $.ajax 将自己处理 header ，因此不需要 header('Content-type: application/json');。

3. 对您在 $comments 数组上所做的分配做一些微调:

   $comments[] = array(                            // without [] you'll always end up with ONE comment
                       'id' => $row['id'],
                       'name' => $row['name'],
                       'text' => $row['text'],
                       'date' => $row['date']
                       ); 
   

4. 正如您巧妙地暗示的那样，您需要迭代返回的数组并逐条追加每个注释:

   success: function(komentarji){
   var parsedComments = JSON.parse(komentarji); //parse the result to Javascript readable objects
       $.each(parsedComments, function(){
           userComments.append("id =>" + this.id + " name => " + this.name + " text =>" + this.text /* etc. */);   //you can access each column key as javascript object key here
      });
   }, //...         
   

注意:您正在执行的数组赋值中有错字，只需删除 'date' => $row 行上的 ) ['date']) 你会没事的。