PHP循环中评论及ID传递至JQuery再返回PHP的异常排查

嘿，我一眼就发现问题所在了——你在循环里给所有textarea重复使用了同一个ID comment1！HTML里ID是全局唯一的标识，当你用$("#comment1").val()时，jQuery只会找到页面上第一个带这个ID的元素，所以后面的按钮点击时，拿到的永远是第一个textarea的值（如果第一个是空的，就会提交空评论），这就是为什么只有第一张图片的评论能正常提交，其他的只能传ID的原因。

下面是具体的修复步骤和代码：

1. 修正PHP代码：移除重复ID，添加评论容器（可选但推荐） #

首先，删掉循环里textarea的id='comment1'，我们不需要用ID来定位它。另外给每个评论区域加一个父容器，方便后续通过DOM结构精准找到对应元素：

<?php
$go="SELECT * FROM images WHERE images.title='$my_course' && images.type!='tutorials'";
$gresult= mysqli_query($conn, $go);
if(mysqli_num_rows($gresult) > 0){
    while($frow= mysqli_fetch_assoc($gresult)){
        $imggd=$frow['id'];
        // 给每个评论组加容器，方便定位
        echo"<div class='comment-group'>"
        ."<textarea name='comment' placeholder='write...'></textarea>"
        ."<button type='submit' name='commentbtn' class='comment1' value='$imggd'>"
        ."<span class='fab fa-telegram-plane'></span>"
        ."</button>"
        ."</div>"
        ."<br/>";
    }
}
?>

2. 修正jQuery代码：通过相对DOM结构获取对应评论内容 #

不再依赖ID选择器，而是通过点击的按钮找到它所在评论组里的textarea，这样就能准确拿到当前图片对应的评论内容：

<script>
$(document).ready(function(){
    $(".comment1").click(function(event){
        event.preventDefault();
        // 获取当前点击的按钮
        const $currentBtn = $(this);
        // 找到当前按钮所在评论组内的textarea，获取值
        const text1 = $currentBtn.closest('.comment-group').find('textarea').val();
        // 获取按钮的value（即图片ID）
        const submit1 = $currentBtn.val();
        
        // 提交到PHP页面
        $("body").load("personal.php",{ comment: text1, commentbtn: submit1 });
    });
});
</script>

更简洁的写法（如果textarea直接在按钮前）： #

因为你的PHP代码里textarea就在按钮的前一个位置，也可以直接用prev()方法，代码更短：

const text1 = $currentBtn.prev().val();

额外优化：用$.post替代body.load() #

$("body").load()会替换整个页面的body内容，用户体验不太好。推荐用$.post提交，这样可以只更新评论区域，不刷新整个页面：

<script>
$(document).ready(function(){
    $(".comment1").click(function(event){
        event.preventDefault();
        const $currentBtn = $(this);
        const text1 = $currentBtn.prev().val();
        const submit1 = $currentBtn.val();
        const $commentGroup = $currentBtn.closest('.comment-group');
        
        // 发送POST请求
        $.post("personal.php", { comment: text1, commentbtn: submit1 }, function(response){
            // 假设personal.php处理后返回新增评论的HTML，添加到当前评论组后
            $commentGroup.after(response);
            // 清空textarea，方便用户继续评论
            $currentBtn.prev().val('');
        });
    });
});
</script>

最后再提一句：永远不要在循环里生成重复的ID，这是HTML的基础规范，会导致各种JS和CSS选择器的异常问题。

内容的提问来源于stack exchange，提问作者Daniel Onyekachi