用jquery实现分页

以下是一个使用 jQuery 实现分页的示例：

HTML 代码：

<div id="data"></div>
<div id="pagination"></div>

JavaScript 代码：

var data = []; // 存放数据的数组
var pageSize = 10; // 每页显示的数据数量
var currentPage = 1; // 当前页码

// 初始化数据
for (var i = 0; i < 100; i++) {
  data.push(i + 1);
}

// 显示数据
function showData() {
  var start = (currentPage - 1) * pageSize;
  var end = start + pageSize;
  var html = '';
  for (var i = start; i < end; i++) {
    if (data[i]) {
      html += '<div>' + data[i] + '</div>';
    }
  }
  $('#data').html(html);
}

// 显示分页
function showPagination() {
  var totalPage = Math.ceil(data.length / pageSize);
  var html = '';
  for (var i = 1; i <= totalPage; i++) {
    if (i === currentPage) {
      html += '<span>' + i + '</span>';
    } else {
      html += '<a href="#" data-page="' + i + '">' + i + '</a>';
    }
  }
  $('#pagination').html(html);
}

// 点击分页
$('#pagination').on('click', 'a', function(event) {
  event.preventDefault();
  currentPage = $(this).data('page');
  showData();
  showPagination();
});

// 初始化
showData();
showPagination();

这个示例会在页面中显示一个数据区域和一个分页区域。当用户点击分页链接时，会更新当前页码并重新显示数据和分页。