从db加载数据live

我想弄清楚如何实时更新ul li列表。从db加载数据live

让我们说：我们有一个无序的列表，每个li元素都显示为最新到最旧。我正在寻找一种方法，轮询服务器以进行更新，并将该更新推送到列表（推测使用jSon）并且没有刷新页面。

例子。

<ul> 
<li>12 seconds ago: Apple</li> 
<li>32 seconds ago: Banana</li> 
<li>42 seconds ago: Grape</li> 
</ul> 

<ul> 
<li>2 seconds ago: Pineapple</li> 
<li>22 seconds ago: Apple</li> 
<li>32 seconds ago: Banana</li> 
<li>52 seconds ago: Grape</li> 
</ul>

所以，如果我们只是盯着页面，就像一个悲伤的失败者。该列表每隔x秒自动从服务器上传最新数据。

我只是想指出一下这种东西需要寻找什么，真的是我们应该寻找的东西。

不确定从服务器推送数据是否比从服务器提取数据更好，我会想象推动会减少过载。

任何sugegstions将不胜感激。

来源

2012-07-19 422

一个可能的解决方案是使用XMLHttpRequest为服务器轮询JSON。您的客户端JavaScript将如下所示：

setInterval(updateList, 5000); // run updateList() every 5 seconds 

// This assumes you're using jQuery 
// You can still do this without jQuery, it just makes things easier 
function updateList() 
{ 
    $.getJSON('<<URL to your JSON producing script here>>', function(data) { 
     var items = []; 

     $.each(data, function(fruit, time) { 
      items.push('<li>' + time + ' seconds ago: ' + fruit + '</li>'); 
     }); 

     $('#my-list').html(items.join('')); 
    }); 
}

而且你的HTML可能是这样的：

<ul id='my-list'> 
</ul>

最后，你的JSON应符合下列格式：

{ 
    'Pinapple' : 2, 
    'Apple' : 22, 
    'Banana' : 42, 
    'Grape' : 52, 
}

来源

2012-07-19 02:59:17

谢谢@Thomas Fussell会放弃这一切 – 422 2012-07-19 04:22:50

有实际上是一个SAAS应用程序现在可以简单快速地完成此操作，因此您不必硬编码并且可以节省时间： Json Data

来源

2013-01-02 07:36:13

从db加载数据live

回答

相关问题