如何使用jQuery Submit提交Razor表单数据？

当然可以啦！你完全能用jQuery的submit()方法提交这个Razor生成的表单，下面给你唠唠具体的实现方式和要注意的关键细节：

基础实现示例 #

你可以通过表单选择器定位到目标表单，要么绑定提交事件做自定义处理，要么直接触发提交动作：

方式1：绑定提交事件，自定义逻辑后提交 #

这种方式适合你需要在提交前做额外检查或处理的场景：

$('form').submit(function(e) {
    // 先阻止默认的表单提交行为
    e.preventDefault();
    
    // 这里可以加自定义的校验逻辑，比如检查时间是否合理
    const startTime = $('#StartTime').val();
    const endTime = $('#EndTime').val();
    
    if (!startTime || !endTime) {
        alert('请填写完整的时间范围哦');
        return;
    }
    
    // 验证通过后，解除绑定再提交，避免循环触发事件
    $(this).unbind('submit').submit();
});

方式2：直接触发提交（比如绑定到按钮点击） #

如果不需要额外逻辑，只是想通过JS触发提交，可以这么写：

// 假设你有一个id为submitBtn的按钮
$('#submitBtn').click(function() {
    $('form').submit();
});

必须注意的几个关键点 #

• 防伪令牌（AntiForgeryToken）：你的表单里已经用@Html.AntiForgeryToken()生成了防伪令牌，用jQuery提交时不需要额外处理——表单提交时会自动携带这个令牌的参数，只要后端接收表单的Action方法上标注了[ValidateAntiForgeryToken]特性，就能正常通过验证，不用担心CSRF的问题。
• 客户端验证：Razor生成的ValidationSummary和ValidationMessageFor是基于ASP.NET客户端验证框架的，用jQuery触发提交时，会自动执行这些验证逻辑，验证不通过的话表单不会提交，和原生表单提交的行为完全一致。如果需要手动触发验证，可以调用$('form').validate().form()来检查。
• 表单的Action和Method：Html.BeginForm()如果没指定参数，默认会使用当前渲染视图的Controller对应的Action（不过通常你应该有一个对应的Post Action来接收表单数据），jQuery提交时会沿用这个设置，不用额外指定。

要是你需要异步提交表单（AJAX），可以用$.ajax()来处理，但单纯用submit()做同步提交是完全没问题的，和原生表单提交的效果一模一样。

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