AJAX POST请求成功后更新的div数秒消失，如何同时刷新表格并保留提示？

开发者阿泽

2026-9-27

问题解决方案

核心原因

你的删除、编辑按钮都放在form标签内部，浏览器默认form内的button类型为submit，点击按钮时除了触发你绑定的AJAX逻辑外，还会触发表单默认提交行为，导致页面整体刷新，刚渲染的提示、编辑表单就会随着页面刷新消失。

具体修改步骤

1. 阻止按钮的默认提交行为

两种方案选一种即可，更推荐第一种：

方案一：给所有操作按钮显式指定type为button，修改PHP渲染部分的按钮代码：

<button type="button" onclick="Delete_ID('Delete','{$list_programs[$ii]["Name_Hash"]}', '{$list_programs[$ii]["Program_Name"]}')" class="button">Delete</button>
<button type="button" onclick="Delete_ID('Edit','{$list_programs[$ii]["Name_Hash"]}', '{$list_programs[$ii]["Program_Name"]}')" class="button">Edit</button>

方案二：在onclick事件末尾加return false阻止默认行为：

<button onclick="Delete_ID('Delete','{$list_programs[$ii]["Name_Hash"]}', '{$list_programs[$ii]["Program_Name"]}');return false;" class="button">Delete</button>
<button onclick="Delete_ID('Edit','{$list_programs[$ii]["Name_Hash"]}', '{$list_programs[$ii]["Program_Name"]}');return false;" class="button">Edit</button>

2. 可选优化（非必须）

你现有代码中$('#ProgramsTable').load()是异步请求，#update-div在#ProgramsTable节点外部，所以表格刷新不会覆盖提示内容。如果需要提示展示一段时间后自动消失，可以在success回调里加定时器：

success: function (data) {
  $('#ProgramsTable').load("../Programs/ProgramChange.php");
  $('#update-div').html(data);
  // 比如3秒后清空提示
  setTimeout(()=>{$('#update-div').empty()}, 3000);
}