刷新json的時間間隔並顯示結果而不刷新頁面

我有一個JSON，就像你在下面看到的那樣，我想「保持活力」。我想不斷地查詢服務器（連續間隔「刷新」，比如30秒），並相應地更新頁面上顯示的內容。該JSON看起來像這樣：刷新json的時間間隔並顯示結果而不刷新頁面

[ 
     { 
      "Name": "Paul", 
      "Date": "2012-10-26", 
      "Score": 8 
     }, 
     { 
      "Name": "Janet", 
      "Date": "2012-10-24", 
      "Score": 18 
     }, 
     { 
      "Name": "Rick", 
      "Date": "2012-10-26", 
      "Score": 13 
     } 
]

我現在的（靜態）版本顯示是這樣的：

<body> 
<script> 
$.getJSON('myjson.json', function(data) { 
for (var i in data) { 
var Name = data[i].Name; 
var Score = data[i].Score; 
}   
var output = "<ul>"; 
for (var i in data) { 
output += "<li>" + Name + "--" + Score; 
} 
output += "</ul>"; 
document.getElementById("placeholder").innerHTML=output; 
}); 
</script> 
<div id="placeholder"></div> 
</body>

這當然顯示的數據，但我將如何「流」的轉變，以「分數「隨着json在服務器上更改（不刷新頁面）？

這是什麼被稱爲投票？

任何幫助表示讚賞。謝謝

來源

2013-01-14 gcubed

你只需要使用一個定時器，或者更具體的，setInterval() ...

<script> 
    function getData() { 
     $.getJSON('myjson.json', function(data) { 
      for (var i in data) { 
       var Name = data[i].Name; 
       var Score = data[i].Score; 
      }   
      var output = "<ul>"; 
      for (var i in data) { 
       output += "<li>" + Name + "--" + Score; 
      } 
      output += "</ul>"; 
      document.getElementById("placeholder").innerHTML=output; 
     }); 
    } 
    setInterval(getData, 30000); 

    $(function() { 
     getData(); 
    }); 
</script>

以上腳本將運行在的document.ready的getData()功能，然後每隔30秒，用返回值更新#placeholder元素。

來源

2013-01-14 18:30:11 Archer

非常感謝你。我注意到，首先要等待數據第一次顯示之前的30秒。當頁面加載時，我將如何將其更改爲立即加載，然後每30秒更新一次？ – gcubed

我會修改，以適應:) – Archer

再次感謝阿徹！ – gcubed

沒有任何花裏胡哨的東西，你可以將整個東西包裝在一個函數中，然後用setInterval或setTimeout調用它，以便它以給定的時間間隔運行代碼。

基本例如：

function getData(){ 
    ... your code ... 

    setTimeout(getData, 3000); // Get data and refresh page every 3000 ms (3 seconds) 
}

//調用函數開球數據採集

getData();

來源

2013-01-14 18:31:14

刷新json的時間間隔並顯示結果而不刷新頁面

回答

相關問題