jQuery+PHP+Ajax動態數字統計展示實例

jQuery+PHP+Ajax實現的一款動態數字統計展示實例，本例是在頁面上動態展示了當前在線用戶數，當然了，你可以應用到其他更多場景中。

首先我們在#number放置要統計的數字：

<div class="count">當前在線：<span id="number"></span></div>

-
然後我們要定義一個動畫過程，使用jQuery的animate()函數實現從一個數字到另一個數字的變換過程，magic_number()自定義函數代碼如下：

function magic_number(value) {  
    var num = $("#number");  
    num.animate({count: value}, {  
        duration: 500,  
        step: function() {  
            num.text(String(parseInt(this.count)));  
        }  
    });  
};

-
然後update()函數使用了jQuery的$.get()向後臺ajax.php發送了一個ajax請求，在得到PHP相應後，調用magic_number()展示最新的數字。爲了能看到更好的效果，我們使用setInterval()每三秒執行一次。

function update() { 
    $.get("ajax.php", 
    function(data) { 
        magic_number(data); 
    }); 
} 
setInterval(update, 3000); 
update();

-
我們隨機從0到999抽取一個數字，你可以從數據庫表裏讀取：

echo mt_rand(0,999);

-
本文轉自：https://www.sucaihuo.com/php/117.html 轉載請註明出處！