使用AJAX的后台会员删除系统仅删除表格首位会员问题求助

问题根因 #

• 重复ID冲突：你在foreach循环中给每行的邮箱td都设置了相同的id="user_email"，HTML规范要求页面ID全局唯一，重复ID的选择器只会匹配到页面中第一个出现的对应元素，也就是表格第一行的邮箱。
• 选择器无范围限制：你在点击事件中直接使用全局类选择器$('.user_id')获取ID，没有限定查找范围为当前点击按钮所在的行，类选择器匹配多个元素时默认返回第一个元素的内容，所以永远只会拿到表格第一行的用户ID。

修改方案 #

第一步：修改PHP模板（member-information-update.php） #

1. 移除邮箱td的重复ID，改为类名标识：

<!-- 原来的代码 -->
<td id="user_email"><?php echo $user["user_email"]?></td>
<!-- 修改为 -->
<td class="user_email"><?php echo $user["user_email"]?></td>

（可选优化）更稳妥的方案是直接把用户参数绑定到删除按钮的自定义属性上，不需要后续遍历DOM查找，避免层级结构变动导致选择器失效：

<!-- 修改删除按钮代码，增加data属性存储用户信息 -->
<button type="button" class="btn btn-danger" name="user_delete_button" data-user-id="<?php echo $user["id"]?>" data-user-email="<?php echo $user["user_email"]?>">
    <i class="far fa-trash-alt"></i>
</button>

第二步：修改JS逻辑（member-information-update.js） #

如果是改了邮箱td为类名的方案，替换原来获取id和邮箱的两行代码：

// 原来的代码
var a_id            =   $.trim($('.user_id').html());
var a_email         =   $.trim($('#user_email').html());
// 替换为
var $currentTr = $(this).closest('tr'); // 定位到当前点击按钮所在的行
var a_id = $.trim($currentTr.find('.user_id').html()); // 仅在当前行内查找ID
var a_email = $.trim($currentTr.find('.user_email').html()); // 仅在当前行内查找邮箱

如果用了自定义data属性的优化方案，更简单直接从按钮拿数据：

var a_id = $(this).data('user-id');
var a_email = $(this).data('user-email');

额外注意项 #

你member-delete-result.php中注释的业务代码有两处拼写错误，后续启用的时候需要修正：

1. 判断行数的变量名写错：if ($kontrol_sayisi>0) 应该改为 if ($number_query>0)
2. 删除语句的字段名写错：DELETE FROM users WHERE id = ? AND users_email = ? 里的users_email应该改为user_email，和你表结构的字段名保持一致。

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