如何用JavaScript在表单提交时移除值为0的name[]字段

云原生阿岚

2026-8-17

实现单选框选中特定值时移除对应字段再提交表单

可以实现这个需求，核心思路是在表单提交前判断选中的单选框值，若为0则临时处理对应的表单元素，让它不随表单提交。以下是基于jQuery的具体实现方案：

方法1：移除字段的name属性

表单提交时，只有带name属性的元素才会被纳入提交数据。我们可以在提交前移除目标单选框组的name属性：

// 给表单绑定提交事件处理函数
$("#formCard").on("submit", function() {
    // 获取当前选中的单选框值
    const selectedVal = $(this).find('input[name="name[]"]:checked').val();
    // 判断是否选中值为0的选项
    if (selectedVal === "0") {
        // 移除所有name为name[]的单选框的name属性
        $(this).find('input[name="name[]"]').removeAttr("name");
    }
});

// 触发表单提交（你的原有代码）
$("#formCard").submit();

方法2：设置字段为禁用状态

禁用（disabled）的表单元素不会被提交，这种方式不会修改元素的name属性，适合需要保留原属性的场景：

$("#formCard").on("submit", function() {
    const selectedVal = $(this).find('input[name="name[]"]:checked').val();
    if (selectedVal === "0") {
        // 禁用所有name为name[]的单选框
        $(this).find('input[name="name[]"]').prop("disabled", true);
    }
});

$("#formCard").submit();