使用fetch实现表单DELETE请求至PHP控制器遇问题求助

点击submit按钮时，浏览器会优先执行表单的默认提交行为（你的<form>标签未指定method和action，默认会以GET方式提交），所以页面会直接跳转（URL末尾的?就是GET提交的特征），导致你的fetch请求要么被中断，要么还没完成就被页面跳转覆盖，PHP控制器自然接收不到DELETE请求。

两种简单的修复方式，任选其一即可：

方式一：阻止表单默认提交行为 #

在onclick事件里先阻止按钮的默认动作，再执行fetch请求：

<form>
    <input onclick="event.preventDefault(); fetch('profile/deleteProfile', {method: 'DELETE'})" type="submit" value="Delete">
</form>

event.preventDefault()会拦截按钮触发的表单提交逻辑，让fetch请求能正常发送。

方式二：改用普通按钮 #

既然不需要表单的默认提交功能，直接把按钮类型改成button，避免触发默认行为：

<form>
    <input onclick="fetch('profile/deleteProfile', {method: 'DELETE'})" type="button" value="Delete">
</form>

普通按钮不会触发表单提交，点击后只会执行onclick里的fetch逻辑。

如果需要给用户反馈请求结果，可以给fetch添加回调逻辑：

fetch('profile/deleteProfile', {method: 'DELETE'})
.then(response => {
    if (response.ok) {
        alert('删除成功');
        window.location.reload(); // 刷新页面更新状态
    } else {
        throw new Error('请求失败');
    }
})
.catch(error => {
    console.error(error);
    alert('删除失败，请重试');
});

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