php - 在数据库更新时通过 Jquery Ajax 跟踪和操作内容

Question

我正在查询数据库以通过 Jquery Ajax 检索内容，并通过使用 SetInterval 函数每 1 分钟查询一次数据库以获取新内容。我的问题是如何跟踪新内容？例如:如果数据库有新内容，我想向其中添加高亮类。如何做到这一点？

用于检索内容的 Jquery 代码

    $(document).ready(hot_listings());
    setInterval( "hot_listings();", 10000 );

    var ajax_load = "<img class='loading' src='images/indicator.gif' alt='loading...' />";
    function hot_listings() {
            $.ajax({
                url: "hot_listing.php",
                cache: false,
                success: function(msg) {
                   $("#hot_properties").html(msg);
                }
           });
    }

好吧，我也包括 Php ..

    <?php
    include("includes/initialize.php"); 
    // hot properties, featured
        $per_page = 3;
        global $database;
        $listings = Listings::hot_listings();
        //while ($listing = $database->fetch_array($listings)) {
         foreach ($listings as $listing ) {
            $listing_id         = $listing->listing_id; //initialize listing_id to fetch datas from other table
            $photo              = Photos::find_by_id($listing_id); //initialize table photo
            $comment            = Comments::find_by_id($listing_id);
            $comment_count      = Comments::count_by_id($listing_id);
            $photo_count        = Photos::count_by_id($listing_id);

            //echo $listing['listing_id'];

     ?>

    <li><span class="imageholder">
        <a href="content.php?id=<?php echo $listing->listing_id; ?>"><img class="listingimageSmall" src="<?php if (!empty($photo->name)) { echo 'uploads/thumbs/'.$photo->name; } else { echo 'images/no-thumb-100.jpg'; } ?>" width="66" height="66" ></a>
    </span>
        <h3><a href="content.php?id=<?php echo $listing->listing_id; ?>"><?php echo ucfirst($listing->title) . ' in ' . ucfirst($listing->city) ; ?></a></h3>
        <p class="description">
        <span class="price">Rs <?php echo $listing->price;  ?></span> 

        <span class="media"> <img src="images/icon_img.jpg" alt="Images" width="13" height="12" /> <?php echo $photo_count;?> Images  &nbsp;<img src="images/comments.png" alt="Images" width="13" height="12" />  <?php echo $comment_count; ?> comments &nbsp;</span>
        </p>
    <div class="clear">&nbsp;</div>
     </li>
    <?php } // end of foreach

    ?>

Answer 1

回答

我建议您更改 PHP 部分以发出有关列表的 JSON 数据。

这可以通过使用 PHP 函数 json_encode() 来完成。您可以在 http://php.net/manual/en/function.json-encode.php 阅读有关 json_encode() 的更多信息.

然后在客户端你就可以这样做:

$.ajax({
     url: "hot_listing.php",
     cache: false,
     success: function(data) {
       last_received_listings = data;
       build_html_in('#hot_properties', data);
     }
});

在 ajax 回调中，您记住刚刚收到的数据，然后从中构建 HTML 标记。

由于您知道自己已经看到了哪些列表，因此当您获得新列表时，您将能够识别新列表。

       var new_listings = detect_new_listings(data, last_received_listings);
       last_received_listings = data;
       build_html_in('#hot_properties');

       highlight_listings(new_listings); // set a CSS class on a div or whatever

更多详情

detect_new_listings 的可能实现

function detect_new_listings(original, new) {
  var result = [];
  for(var i = 0; i < original.length; i++) {
    var found = false;

    // find similar listing in new
    for(var j = 0; j < new.length; j++) {
      if(original[i].listing_id == new[j].listing_id) {
        found = true;
        break;
      }
    }

    if(!found) {
      result.push(original[i]);
    }
  }
  return result;
}