0

我正在写一个新闻提要，我想知道如何在不刷新的页面上进行分页。当我单击按钮时，我执行 json 请求以获取新数据，但我不刷新页面。

这是我所拥有的：

HTML

<!-- Forum -->
<div id="forum"><center>Loading forum...</center></div>
<!-- Forum pagination -->
<ul class="pager">
  <li class="previous" id="forum-prev">
    <a href="#forum-top">Prev</a>
  </li>
  <li class="next" id="forum-next">
    <a href="#forum-top">Next</a>
  </li>
</ul>

JS

function updateButtons()
{
// Button prev forum
$("#forum-prev").click(function() {
  var page = parseInt($.cookie("page"));
  page -= 1;
  $.cookie("page", page);
  loadforum();
  updateButtons();
});

// Button next forum
$("#forum-next").click(function() {
  var page = parseInt($.cookie("page"));
  page += 1;
  $.cookie("page", page);
  loadforum();
  updateButtons();
});
// Disable buttons
if($.cookie("page") >= 0)
{
  $("#forum-prev").removeClass("active");
  $("#forum-prev").addClass("disabled");
  $("#forum-prev").unbind("click");
}
else
{
  $("#forum-prev").removeClass("disabled");
  $("#forum-prev").addClass("active");
  $("#forum-prev").bind("click");
}
if($.cookie("page") <= parseInt($.cookie("forum-count"))-1)
{
  $("#forum-next").removeClass("active");
  $("#forum-next").addClass("disabled");
  $("#forum-next").unbind("click");
}
else
{
  $("#forum-next").removeClass("disabled");
  $("#forum-next").addClass("active");
  $("#forum-next").bind("click");
}
}

如果我不刷新页面，最好的分页方式是什么，并且 prev 按钮应该在 on 时禁用，并且在何时启用page 0(default)，page > 0next 应该在 时禁用page < maxPage。我尝试使用$.on() $.off()但我有同样的问题，因为 JS 没有重新加载我无法启用或禁用按钮。

4

0 回答 0