刷新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的时间间隔并显示结果而不刷新页面

回答

相关问题