2012-07-04 210 views
0

我試圖獲得像http://www.minecraft.net頁面那樣自動更新數據庫銷售的效果,我一直在研究這個問題兩個月,但沒有運氣。 我有一個PHP文件,其中找到多少結果在數據庫中,並將它們顯示爲一個數字,工作正常http://tzeale.com/sandbox/stats/pull.php從SQL數據庫自動更新統計信息

我想要做的是得到像minecraft.net的效果,它會自動更新而不刷新這一頁。任何人都可以指導我做什麼?我不知道還有什麼要嘗試。

謝謝。

回答

2

開始的計數器h您需要使用AJAX。

setTimeout,旁邊一個AJAX調用該pull.php

如果您正在使用jQuery,這裏是如何實現你想要的一個很好的例子。 添加了一個簡單的邏輯,看看服務器是否死了,並最終停止。

var failed = 0; 
var limit_failed = 5; 
(function updateSales(waitTime){ 
    waitTime = waitTime || 1000; // Set to 1 second by default 

    setTimeout(function(){ 
     $.ajax({ 
      url: 'pull.php', 
      success: function(response){ 
       // Update something with your response 
       alert ("sales are now at: "+ response); 
       updateSales(); // Recursion 
      }, 
      error: function(){   
       // Error handling - not necessary 
       // If the request failed more then (limit_failed) times, you might want to stop it from checking after (limit_failed) times, 
       // and in the meanwhile icnrease the wait time, so the server has more time to get back online. 
       if(++failed < limit_failed){ 
        waitTime += 1000; 
        updateSales(waitTime); 
       } 
      } 
     }); 
    }, waitTime); 
})(); 
1

您將使用setTimeout和Ajax。 setTimeout會每1000毫秒(或者您設置它)使用Ajax獲取數據。

你會換你顯示計數在html像這樣的例子:

<span id="mycount"></span> 

然後jQuery代碼會是這個樣子:

setTimeout(function(){ 
    $.get("/sandbox/stats/pull.php",function(data){ 
     $("#mycount").html(data); 
    }); 
},1000); 

1000是一秒,你可以改變如果你願意的話。我不知道如何使它具有這種動畫效果,但是一旦您檢索數據,它就會進入您的$.get()函數。這也必須是在同一個域中http://tzeale.com/對阿賈克斯的工作因same origin policy


無論其,審查TE minecraft.net網站後,我發現他們加載這些數據轉化爲自己的一頁的時候,而不是每1秒得到它:

<script> 
var justLoggedIn = false; 
var totalUsers = 33652552; 
var paidUsers = 6495707; 
var totalUsersRate = 1.2166667; 
var paidUsersRate = 0.15; 
</script> 

然後,他們沒有獲得與此實時數據。他們只是獲得當前的金額,然後繼續加1。

他們使用此插件使其成爲動畫:http://timeago.yarp.com/ 仍然使用setTimeout()繼續每秒添加1。我不認爲這是真正的用戶,只需要一個從var totalUsers

+0

非常感謝!這已經困擾我近三個月了! :d –