ssm项目分页的前端js代码

以下是一个示例的前端JS代码，用于实现SSM项目的分页功能：

// 定义全局变量
var currentPage = 1; // 当前页码
var pageSize = 10; // 每页显示的记录数
var totalPage; // 总页数

// 页面加载完成后执行的函数
$(document).ready(function() {
    // 初始化页面数据
    loadData();

    // 上一页按钮点击事件
    $("#prevBtn").click(function() {
        if (currentPage > 1) {
            currentPage--;
            loadData();
        }
    });

    // 下一页按钮点击事件
    $("#nextBtn").click(function() {
        if (currentPage < totalPage) {
            currentPage++;
            loadData();
        }
    });

    // 跳转按钮点击事件
    $("#jumpBtn").click(function() {
        var jumpPage = parseInt($("#jumpPage").val());
        if (jumpPage >= 1 && jumpPage <= totalPage) {
            currentPage = jumpPage;
            loadData();
        }
    });
});

// 加载数据函数
function loadData() {
    // 发送AJAX请求获取数据
    $.ajax({
        url: "url/to/getData",
        type: "GET",
        data: {
            currentPage: currentPage,
            pageSize: pageSize
        },
        success: function(response) {
            // 解析返回的数据
            var data = JSON.parse(response);
            var list = data.list;
            totalPage = data.totalPage;

            // 渲染数据到页面
            // ...

            // 更新分页信息
            $("#currentPage").text(currentPage);
            $("#totalPage").text(totalPage);

            // 更新分页按钮状态
            if (currentPage == 1) {
                $("#prevBtn").attr("disabled", true);
            } else {
                $("#prevBtn").attr("disabled", false);
            }

            if (currentPage == totalPage) {
                $("#nextBtn").attr("disabled", true);
            } else {
                $("#nextBtn").attr("disabled", false);
            }
        },
        error: function() {
            alert("Error occurred while loading data.");
        }
    });
}

在上面的代码中，我们首先定义了一些全局变量，包括当前页码、每页显示的记录数和总页数。然后，在页面加载完成后，我们初始化页面数据，并为上一页、下一页和跳转按钮绑定点击事件。在点击事件中，我们根据按钮的操作更新当前页码，并调用loadData()函数重新加载数据。在loadData()函数中，我们发送AJAX请求获取数据，并根据返回的数据进行页面渲染和更新分页信息。