PHP+Ajax加载更多数据出现重复条目问题求助

嘿，我来帮你搞定这个加载重复的问题！核心问题出在你SQL语句里LIMIT和OFFSET的参数顺序搞反了，咱们一步步理清楚：

问题根源分析 #

你当前的加载更多SQL是：

$sql = "SELECT name FROM table WHERE cat = 2 LIMIT $current OFFSET $limit";

但MySQL中LIMIT的正确用法有两种：

1. LIMIT 偏移量, 条数
2. LIMIT 条数 OFFSET 偏移量

你现在把每次要加载的条数和从哪条开始加载的偏移量搞反了。比如初始加载了10条，想加载下一批时，应该从第10条之后开始取（OFFSET=10），取10条（LIMIT=10），但你的写法导致重复读取前面的内容，自然就出现重复条目了。

修正后的完整代码实现 #

1. 初始加载代码（保持不变） #

$sql = "SELECT name FROM table WHERE cat = 2 LIMIT 10";

2. 加载更多的PHP代码（修正SQL逻辑+防注入） #

别直接把$_GET参数拼进SQL，用预处理语句避免SQL注入风险：

// 获取当前已加载的条目数，转成整数防止非法输入
$currentCount = isset($_GET['current']) ? (int)$_GET['current'] : 0;
// 每次固定加载10条，前后端保持一致
$perPage = 10;
// 计算偏移量：当前已加载的数量就是下一批数据的起始位置
$offset = $currentCount;

// 用PDO预处理语句执行查询（如果用mysqli同理）
$stmt = $pdo->prepare("SELECT name FROM table WHERE cat = 2 LIMIT ? OFFSET ?");
$stmt->execute([$perPage, $offset]);
$newItems = $stmt->fetchAll(PDO::FETCH_ASSOC);

// 返回JSON格式数据给前端
echo json_encode($newItems);

3. Ajax前端代码（修正参数传递+优化交互） #

你用$('.Ads').length获取当前条目数是对的，调整参数传递逻辑，再加上防重复点击的处理：

$('.getMore').click(function() {
    var $btn = $(this);
    // 点击后禁用按钮，防止连续点击重复加载
    $btn.prop('disabled', true).text('加载中...');
    
    var currentCount = $('.Ads').length;
    var perPage = 10;

    $.ajax({
        url: 'your-load-more.php', // 替换成你的PHP文件路径
        type: 'GET',
        data: {
            current: currentCount
        },
        success: function(response) {
            var items = JSON.parse(response);
            if (items.length === 0) {
                // 没有更多内容了，直接隐藏按钮
                $btn.hide();
                return;
            }
            // 把新数据渲染到页面
            items.forEach(function(item) {
                $('.Ads-container').append('<div class="Ads">' + item.name + '</div>');
            });
            // 恢复按钮状态
            $btn.prop('disabled', false).text('加载更多');
        },
        error: function() {
            alert('加载失败，请重试');
            $btn.prop('disabled', false).text('加载更多');
        }
    });
});

额外优化提示 #

• 空数据处理：当后端返回空数组时，说明没有更多内容，直接隐藏“加载更多”按钮，避免无效请求。
• 参数校验：后端要对$_GET['current']做整数校验，防止恶意输入导致SQL报错。
• 统一条数：前后端的perPage尽量保持一致，避免出现逻辑混乱。

内容的提问来源于stack exchange，提问作者Jack The Baker