使用jQuery分页xml结果的最佳方式是什么？

Question

我正在使用jQuery从MySQL数据库中获取结果，如xml。分类结果的最佳方式是什么？

现在我的脚本获取xml并将每个结果作为<li>元素附加到<ul>元素。

我猜这将与创建一个全局变量有关，该变量可以通过运行脚本删除的下一个/上一个页面按钮进行更改，然后重新附加正确的结果范围，但我不是非常肯定。

Answer 1

你不应该使分页依赖于Javascript，它应该做服务器端而不是。因此，例如，服务器可能会返回一个类似于<a href="results.php?entry=50">View next 50 results</a>的“下一个”链接。该脚本将采用50的变量并返回50个下一个结果，然后链接将返回为results.php?entry=100。您可以将其与Ajax集成，以便在没有页面刷新的情况下返回结果，但分页本身仍然会在后端完成。

Answer 2

我会做这样的事

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) 

Answer 3

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(); 
    }); 
} 

Answer 4

您是否一次性获得整个结果集（所有页面），还是一次获得一个页面？在任何情况下，您都应该保存从服务器接收的数据的本地缓存，并在用户浏览页面时使用该缓存。例如，如果您一次检索一个页面，并且用户从页面1转到页面2，则需要从服务器检索页面2。但是如果用户现在回到第1页，那么你应该从缓存中加载它。如果用户转到第3页，那么您应该从服务器获取并将其添加到缓存中。

接下来，我将用于显示单个页面的逻辑分开给用户，并从服务器获取页面。当用户点击下一页按钮时，应该询问缓存对象的下一页，但不要返回任何内容。相反，一旦缓存有数据，它将调用回调函数。如果数据在缓存中，它将立即调用回调函数，并将结果作为参数传递。回调函数将更新呈现给用户的视图。如果数据不在缓存中，则会向服务器发送ajax请求以获取该数据。一旦数据被检索，回调函数将被调用。

我通常反对使用XML与Ajax（我更喜欢ajaj;异步JavaScript和JSON，它也是更大的乐趣）。 JSON是一个更好的选择，因为使用JavaScript更容易，它在内存和传输过程中都占用更少的空间。由于JSON对象是普通的JavaScript对象，因此将它们添加到本地缓存就像连接两个数组（您已拥有的缓存和从服务器检索到的新元素）一样简单。