如何使用ajax / json刷新页面部分？

Question

i am building a chat website, now i working on ONLINE USER . I use AJAX to refresh but i meet some problems with Append.(); . When refreshing section the same data appear again and again...That is the PHP file.

<?php
public function online(){
    $database = new DB();
    $db = $database->database();
    $array = array();
    $ref = $_SESSION['oc_users_ref'];

    $time_out = time()-5;
    $time = time();

    $query = $db->query("SELECT * FROM oc_users WHERE users_online = 0");

    $updateOnline = $db->query("UPDATE oc_users SET users_online = 1 WHERE users_lastcome < '$time_out'");

    $q = $db->query("SELECT * FROM oc_users WHERE users_ref <> '$ref' AND users_online = 0 ORDER BY users_lastcome DESC");

     while($data = $q->fetch()) {
        if($data['users_online'] == 1){
            $class = "opacity30";
        }else{
            $class = '';
        }
        $array[] = $data;
     }
     print json_encode($array);
} ?>

Now the Javascript

 function getOnline(){ $.ajax({ url: "conf/users.php?act=online", dataType: "text", success: function(data) { var json = $.parseJSON(data); for (var i=0;i<json.length;++i) { $('#printOnline').append('<li><a href="javascript:void(0);" onclick=javascript:chatWith("'+json[i].users_nickname+'")><i></i>'+json[i].users_nickname+'</a></li>'); } } }); } setInterval('getOnline()',10000); 

And the result*

User001 User001 User001 User001 User001 User001 User001 User001

Please help me...Great Thanks

Answer 1

Reset the user list before updating:

function getOnline(){
    $.ajax({
        url: "conf/users.php?act=online",
        dataType: "text",
        success: function(data) {
            $('#printOnline').html("");
            var json = $.parseJSON(data);
            for (var i=0;i<json.length;++i)
            {
                $('#printOnline').append('<li><a href="javascript:void(0);" onclick=javascript:chatWith("'+json[i].users_nickname+'")><i></i>'+json[i].users_nickname+'</a></li>');
            }
        }
    });
}
setInterval('getOnline()',10000);