jQuery/Ajax 帮助 - 在 div 中加载页面，在 div 中更新页面，然后单击答案

【问题标题】：jQuery/Ajax help - Load page in div, update page in div, and clickingjQuery/Ajax 帮助 - 在 div 中加载页面，在 div 中更新页面，然后单击
【发布时间】：2019-06-09 03:52:42
【问题描述】：

我有一个 div，其中加载了一个页面，其中包含来自数据库的数据列表。目标是将列表拆分为页面，并通过单击链接而不刷新页面来导航页面。

以下代码加载div中的页面，更新div中的页面，但只允许点击页面加载。我不确定如何在 div 中发生更新时允许单击。基本上我可以单击到第 2 页，但不能单击返回到第 1 页或转到第 3 页。单击没有任何结果。当我转到第 2 页时，链接正确链接到第 1 页和第 3 页。我不知道如何将点击功能应用于加载和 html。

$('#display-list').load('list.php', function() {
    $("#list-next-page").click(function(){
        var page=$("#list-next-page").val();
            $.ajax({
                url:'list.php?page_id=' + page,
                method:'GET',
                data:{
                    page:page,
                },
                success:function(data){
                    $('#display-list').html(data);
                }
            });
    }); 
});

【问题讨论】：

标签： jquery ajax pagination

【解决方案1】：

执行以下操作似乎有效：

$('#display-list').load('list.php', function() {
    $("#list-next-page").click(handleClick);
}); 

function handleClick(){
        var page=$("#list-next-page").val();
        $.ajax({
            url:'list.php?page_id=' + page,
            method:'GET',
            data:{
                page:page,
            },
            success:function(data){
                $('#display-list').html(data);
                $("#list-next-page").click(handleClick);
                $("#list-prev-page").click(handleClick);
            }
     });    
}

我必须修改它以正确传递下一个和上一个链接的页码。

【讨论】：