解决AJAX动态加载元素事件失效：深入理解jQuery事件委托

// PHP代码中嵌入的JavaScript，用于绑定事件
echo "<script>
        $('.show_more').unbind().click(function(e) { // 这里的绑定方式是问题的根源
            e.preventDefault(); 
            // ... AJAX 逻辑 ...
        });
    </script>";

// 在PHP的fetch函数中，将JavaScript代码调整为使用事件委托
// 注意：为了更好的实践，这段JS应放在独立的JS文件或<script>标签中，而不是每次PHP生成HTML时都输出
<?php
function fetch() {
    // ... PHP逻辑生成初始HTML ...
    // 例如，假设 $pathss 是 AJAX 请求的 URL
    $pathss = base_url() . "Main/GetFeedCommentsById";
    ?>
    <script>
        // 使用事件委托，将点击事件绑定到document上，并筛选目标为.show_more的元素
        $(document).on('click', '.show_more', function(e) {
            e.preventDefault(); 
            var $this = $(this); // 缓存当前点击的按钮

            // 从按钮的data属性中获取所需参数，避免依赖全局ID固定的隐藏域
            var ID = $this.attr('id');
            var vals = $this.data('val');
            var status = $this.data('status');
            var fixs = $this.data('fixs'); // 从按钮自身获取，而不是从ID固定的隐藏域
            var MinValue = $this.data('minvalue');
            var MaxValue = $this.data('maxvalue');
            var FeedIdd = $this.data('feedidd');

            // 隐藏当前点击的“加载更多”按钮，显示加载动画
            $this.hide();
            $this.siblings('.loding').show(); // 假设加载动画是兄弟元素

            $.ajax({
                type: 'POST',
                url: '<?php echo $pathss; ?>', // PHP变量在此处被JS使用
                data: {id: ID, vals: vals, status: status, fixs: fixs, MinValue: MinValue, MaxValue: MaxValue, FeedIdd: FeedIdd},
                success: function(html){
                    // 移除旧的“加载更多”区域（如果返回的HTML包含新的加载区域）
                    // 确保移除的是当前点击按钮所在的父容器
                    $this.closest('.show_more_main').remove();
                    // 将新内容追加到指定容器
                    $('.postList' + ID).append(html); // 确保postListX是动态生成的容器
                },
                error: function(xhr, status, error) {
                    console.error("AJAX请求失败:", status, error);
                    // 请求失败时，重新显示“加载更多”按钮并隐藏加载动画
                    $this.show();
                    $this.siblings('.loding').hide();
                    alert('加载失败，请稍后再试。');
                }
            });
        });
    </script>
    <?php
}
?>

function GetFeedCommentsById()
{
    if (!empty($_POST["id"])) {
        // ... (PHP后端数据查询逻辑保持不变) ...

        // 假设 $postID, $MaxId, $MinIds, $_POST["fixs"], $_POST["id"], $FeedId 等变量已正确计算
        // 确保这些值在输出到HTML时是安全的（例如，使用htmlspecialchars）

        // 输出评论列表
        if ($TotalRecords > 0) {
            foreach($result as $row) {
                // ... 输出评论内容 ...
                echo '<div class="list_item">' . htmlspecialchars($row['comment']) . '</div>';
            }
        }

        // 输出新的“加载更多”按钮区域
        if ($totalRowCount > $showLimit) {
            // 注意：这里需要确保 $postID, $MaxId, $MinIds, $_POST["fixs"], $_POST["id"], $FeedId
            // 能够正确反映当前批次的数据边界和feed ID
            // 尤其是MinId和MaxId的计算逻辑，需要确保在每次加载时能正确更新查询范围
            $currentPostID = $postID; // 假设这是当前批次最后一个评论的ID
            $nextMinValue = $currentPostID; // 下一批次查询的起始ID
            $nextMaxValue = $MaxId; // 下一批次查询的结束ID
            $originalFixs = $_POST["fixs"]; // 原始的fixs值

            ?>
            <div class="show_more_main" id="show_more_main<?php echo htmlspecialchars($currentPostID); ?>">
                <span id="<?php echo htmlspecialchars($currentPostID); ?>"
                      data-val='<?php echo htmlspecialchars($_POST["id"]); ?>'
                      data-status='<?php echo htmlspecialchars($currentPost["status"] ?? $currentPostID); ?>'
                      data-fixs='<?php echo htmlspecialchars($originalFixs); ?>'
                      data-minvalue='<?php echo htmlspecialchars($nextMinValue); ?>'
                      data-maxvalue='<?php echo htmlspecialchars($nextMaxValue); ?>'
                      data-feedidd='<?php echo htmlspecialchars($FeedId); ?>'
                      class="show_more" title="Load more posts">Show more</span>
                <span class="loding" style="display: none;"><span class="loding_txt">Loading...</span></span>
            </div>
            <?php
        }
    }
}