我正在使用jQuery从MySQL数据库中获取结果,如xml。分类结果的最佳方式是什么?使用jQuery分页xml结果的最佳方式是什么?
现在我的脚本获取xml并将每个结果作为<li>
元素附加到<ul>
元素。
我猜这将与创建一个全局变量有关,该变量可以通过运行脚本删除的下一个/上一个页面按钮进行更改,然后重新附加正确的结果范围,但我不是非常肯定。
我正在使用jQuery从MySQL数据库中获取结果,如xml。分类结果的最佳方式是什么?使用jQuery分页xml结果的最佳方式是什么?
现在我的脚本获取xml并将每个结果作为<li>
元素附加到<ul>
元素。
我猜这将与创建一个全局变量有关,该变量可以通过运行脚本删除的下一个/上一个页面按钮进行更改,然后重新附加正确的结果范围,但我不是非常肯定。
你不应该使分页依赖于Javascript,它应该做服务器端而不是。因此,例如,服务器可能会返回一个类似于<a href="results.php?entry=50">View next 50 results</a>
的“下一个”链接。该脚本将采用50的变量并返回50个下一个结果,然后链接将返回为results.php?entry=100
。您可以将其与Ajax集成,以便在没有页面刷新的情况下返回结果,但分页本身仍然会在后端完成。
我知道,但它是一个个人项目,所以我不关心javascript被启用/禁用或浏览器兼容性。我想看看我能用javascript/jQuery做些什么 – mcpete 2009-12-14 23:03:22
我会做这样的事
var numRows = $table.find('tbody tr').length
var numPages = Math.ceil(numRows/numPerPage)
var $pager = $('</p><br>
<div class="pager"></div>
')
for (var page = 0 page < numPages page++) {
$('<span class="page-number">' + (page + 1) + '</span>')
.appendTo($pager).addClass('clickable')
}
$pager.insertBefore($table)
这有点帮助。谢谢 – mcpete 2009-12-14 23:12:07
There are a few plugins,但你是正确的轨道上。当你做删除/重新附加的事情时,做一个$('#mydiv')。load('/ path/to/myfile.php')。将您的文件传递给开始点和停止点,它们将作为数组中用于获取数据的点。
function paginate(start, limit) {
// Maybe show a preloader?
$('#loader').show();
$("#mydiv").load("/path/to/myfile.php", {start: start, end: limit}, function(){
// hide preloader or do other code here
$('#loader').hide();
});
}
这是非常有用的知道。谢谢。 – mcpete 2009-12-14 23:10:49
您是否一次性获得整个结果集(所有页面),还是一次获得一个页面?在任何情况下,您都应该保存从服务器接收的数据的本地缓存,并在用户浏览页面时使用该缓存。例如,如果您一次检索一个页面,并且用户从页面1转到页面2,则需要从服务器检索页面2。但是如果用户现在回到第1页,那么你应该从缓存中加载它。如果用户转到第3页,那么您应该从服务器获取并将其添加到缓存中。
接下来,我将用于显示单个页面的逻辑分开给用户,并从服务器获取页面。当用户点击下一页按钮时,应该询问缓存对象的下一页,但不要返回任何内容。相反,一旦缓存有数据,它将调用回调函数。如果数据在缓存中,它将立即调用回调函数,并将结果作为参数传递。回调函数将更新呈现给用户的视图。如果数据不在缓存中,则会向服务器发送ajax请求以获取该数据。一旦数据被检索,回调函数将被调用。
我通常反对使用XML与Ajax(我更喜欢ajaj;异步JavaScript和JSON,它也是更大的乐趣)。 JSON是一个更好的选择,因为使用JavaScript更容易,它在内存和传输过程中都占用更少的空间。由于JSON对象是普通的JavaScript对象,因此将它们添加到本地缓存就像连接两个数组(您已拥有的缓存和从服务器检索到的新元素)一样简单。
你打算用更多的ajax更新结果还是一次性获得结果并对结果进行分页? – czarchaic 2009-12-14 22:49:24
我一次获得所有结果并将它们存储在一个对象中。所以我只打算做一个Ajax调用每页加载 – mcpete 2009-12-14 22:55:47