javascript - AJAX一次调用将多组数据插入到单独的div中

Question

当前，当向服务器请求数据时，当像这样发回一组数据时

{"num":1,"notification_id":"818","notification_content":
"Lucy  Botham posted a status on your wall","notification_throughurl"}

div 已插入。

但假设有两组具有不同的通知 ID，如下所示

{"num":1,"notification_id":"818","notification_content":
"Lucy  Botham posted a status on your wall","notification_throughurl"}

{"num":1,"notification_id":"819","notification_content":
"Lucy  Botham posted a status on your wall","notification_throughurl"}

什么也没发生

所以我将削减代码以展示我所拥有的示例

        success: function(response){
            if(response.notification_id > notification_id){

            $("#notif_ui"+ notification_id).prepend('
    <div class="notif_text"><div  id="notif_actual_text-'+response['notification_id']+'" 
        class="notif_actual_text"><img border=\"1\" src=\"userimages/cropped'+response
            ['notification_triggeredby']+'.jpg\" 
onerror=this.src=\"userimages/no_profile_img.jpeg\" 
        width=\"40\" height=\"40\" ><br /></div></div>');
                  i = parseInt($("#mes").text()); $("#mes").text((i+response.num)); 
            }

我正在考虑是否可以使用

  $.each(response, function (i, val) 

但我还是不确定。

编辑确切的 react 如何显示

{"num":1,"notification_id":"823","notification_content":"Lucy  Botham posted a status on your wall","notification_throughurl"
:"singlepoststreamitem.php?streamitem_id=703","notification_triggeredby":"85","notification_status":"1"
,"notification_time":"2015-11-08 04:16:26"}{"num":1,"notification_id":"824","notification_content":"Lucy
  Botham posted a status on your wall","notification_throughurl":"singlepoststreamitem.php?streamitem_id
=704","notification_triggeredby":"85","notification_status":"1","notification_time":"2015-11-08 04:16
:27"}

和我的While循环

while($row = mysqli_fetch_assoc($com)){
if($row['notification_status']==1){
$num = mysqli_num_rows($com);

if($num){
    $json['num'] = 1;
}else{
    $json['num'] = 0;
}
    $json['notification_id'] = $row['notification_id'];
    $json['notification_content'] = $row['notification_content'];
    $json['notification_throughurl'] = $row['notification_throughurl'];
    $json['notification_triggeredby'] = $row['notification_triggeredby'];
    $json['notification_status'] = $row['notification_status'];
    $json['notification_time'] = $row['notification_time'];



echo json_encode($json);
}}

Answer 1

首先，您需要构建一组通知，而不是单个通知:

<?php
$json = array(
    'notifications' => array()
);

while ($row = mysqli_fetch_assoc($com)) {
    if ($row['notification_status'] == 1) {
        $num = mysqli_num_rows($com);

        $notification = array();
        if ($num) {
            $notification['num'] = 1;
        } else {
            $notification['num'] = 0;
        }
        $notification['notification_id'] = $row['notification_id'];
        $notification['notification_content'] = $row['notification_content'];
        $notification['notification_throughurl'] = $row['notification_throughurl'];
        $notification['notification_triggeredby'] = $row['notification_triggeredby'];
        $notification['notification_status'] = $row['notification_status'];
        $notification['notification_time'] = $row['notification_time'];
        $json['notifications'][] = $notification;
    }
}

echo json_encode($json);
?>

然后您可以从 JavaScript 访问通知数组:

        success: function(response) {

            $.each(response.notifications, function(i, notification) {

                if (notification.notification_id > notification_id) {

                    $("#notif_ui" + notification_id).prepend('<div class="notif_text"><div id="notif_actual_text-' + notification['notification_id'] + '" class="notif_actual_text"><img border=\"1\" src=\"userimages/cropped' + notification['notification_triggeredby'] + '.jpg\" onerror=this.src=\"userimages/no_profile_img.jpeg\" width=\"40\" height=\"40\" ><br /></div></div>');
                    i = parseInt($("#mes").text());
                    $("#mes").text((i + response.num));
                }
            })
        }

注意，完全未经测试，但希望您能看到差异!