如何使用jquery显示更多列表
我拿出消息并用PHP / MySQL显示。
现在我想只显示10个列表。
我想添加按钮。 当我单击此按钮时，它会顺利滑下并显示另外10条消息，共20条消息。
如果我单击按钮，它会再次向下滑动并显示总共30条消息。
有人可以教我如何用jquery做吗？
提前致谢。
原则上，您需要一个容器放置所有新获取的消息。
然后你想要一个按钮（或锚点，或者其他什么），你可以连接到一个fetch-more-method：
将连接放在DOMReady中的某个位置：
var lastFetchedMessage = 0; $('#btnFetchMessages').click(function() { $.ajax({ url: '/getMessages.php', type: 'POST', contentType: 'application/json; charset=utf-8', dataType: 'json', data: '{"lastId":'+lastFetchedMesasge+'"}', success: newMessagesReceived });
因此，只需单击按钮，我们就会向getMessages.php提交一个AJAX请求，您将在其中查看lastFetchedMessage并根据该消息返回10个左右的下lastFetchedMessage消息。 在该页面中，您将返回包含消息的JSON数组，以及您感兴趣的所有信息。
成功的AJAX请求后，将调用函数newMessagesReceived ：
function newMessagesReceived(result) { var container = $('#newMessages'); for(var i = 0; i < result.length; i++) { var message = $('' + result[i].body + ''); container.append(message); } var lastFetchedMessage = result[i].id; }
以上假设您返回一个包含消息的数组，该数组至少包含属性body和id ：
[ { "body": "new message1", "id": "10" }, { "body": "new message2", "id": "11" } ]
在我的最新项目中，我使用可滚动的jQuery工具在列表中显示20个最新项目（
）。 当列表滚动到最后一页时，我获取接下来的20个项目，然后使用build in jquery tools api将其附加到列表的末尾。 这将持续到AJAX请求返回空结果，这表示数据库中没有更多列表。 我有一个变量作为标志，然后我将其设置为false，因此当列表滚动到最后一页时没有触发AJAX请求。
您可能会看到它看起来像Twitter主页，但没有“更多”链接，因为列表会自动附加。
不幸的是，目前该项目仍处于alpha状态，因此我无法在此处显示。 您可以尝试并在此处发布您的代码，我会帮您调整它。
使用javascript来保存有关显示行数的状态信息等。
让按钮调用一个通过ajax返回数据的JS函数。 ajax调用的结果可以是HTML并注入div标记。 JS函数需要更新状态信息（每次增加行数等），并将该状态信息传递给ajax调用。
ajax调用的目标可以是一个PHP脚本，它执行MySQL查询并生成传回的HTML。