如何让ASP.NET MVC链接发送DELETE请求？

这里有两个符合你需求的方案，不用Ajax，也能发送DELETE请求来清空购物车：

方案1：用表单模拟（无JS，纯HTML/CSS） #

把清空操作做成一个样式像链接的表单提交按钮，利用X-HTTP-Method-Override来模拟DELETE请求（因为浏览器原生表单只支持GET/POST）：

@using (Html.BeginForm("Clear", "你的控制器名", FormMethod.Post))
{
    @Html.Hidden("X-HTTP-Method-Override", "DELETE")
    <button type="submit" style="border: none; background: transparent; color: #007bff; text-decoration: underline; cursor: pointer;">Clear</button>
}

• 样式可以根据你的网站风格调整，让按钮看起来和普通链接完全一致
• 后端控制器的Clear方法需要标记[HttpDelete]，ASP.NET MVC会自动识别X-HTTP-Method-Override头并按DELETE请求处理：

[HttpDelete]
public ActionResult Clear()
{
    // 执行清空购物车逻辑
    return RedirectToAction("购物车列表页");
}

方案2：用原生JS保留a标签样式 #

如果你更想保留<a>标签的结构，可通过JS拦截点击事件，动态创建表单提交DELETE请求（非异步，页面会正常刷新，不算Ajax）：

<a href="@Url.Action("Clear", "你的控制器名")" id="clearCartLink">Clear</a>

<script>
document.getElementById('clearCartLink').addEventListener('click', function(e) {
    e.preventDefault(); // 阻止默认GET跳转
    
    // 创建临时表单
    const form = document.createElement('form');
    form.method = 'POST';
    form.action = this.href;
    
    // 添加方法覆盖的隐藏字段
    const methodInput = document.createElement('input');
    methodInput.type = 'hidden';
    methodInput.name = 'X-HTTP-Method-Override';
    methodInput.value = 'DELETE';
    
    form.appendChild(methodInput);
    document.body.appendChild(form);
    form.submit();
});
</script>

这个方案既保留了链接的视觉样式，又能按规范发送DELETE请求，完全不需要Ajax.ActionLink。

注意：确保你的ASP.NET MVC项目启用了HTTP方法覆盖，默认情况下框架是支持的，不需要额外配置。

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