你可以在表单的提交事件中执行一些Javascript。这就是你所能做的，没有办法让浏览器自己做这件事。这也意味着没有Javascript的用户将无法使用表单。 更好的方法是在服务器上知道有哪些复选框，这样就可以推断出那些从提交的表单值(PHP中的$_POST)中缺少的复选框是未选中的。

这个解决方案的灵感来自@desw的一个。

如果您的输入名称是“表单样式”的，那么只要选中一个复选框，您就会失去与复选框值的数组索引关联，每次选中一个复选框，这种“分离”就增加一个单元。这可能是用于插入由某些字段组成的雇员的表单的情况，例如:

<input type="text" name="employee[]" />
<input type="hidden" name="isSingle[] value="no" />
<input type="checkbox" name="isSingle[] value="yes" />

如果您一次插入三个员工，并且第一个和第二个员工是单个的，那么您最终将得到一个5元素的isSingle数组，因此您将不能一次遍历三个数组，例如，为了在数据库中插入员工。

你可以用一些简单的数组后处理来克服这个问题。我在服务器端使用PHP，我这样做:

$j = 0;
$areSingles = $_POST['isSingle'];
foreach($areSingles as $isSingle){
  if($isSingle=='yes'){
    unset($areSingles[$j-1]);
  }
  $j++;
}
$areSingles = array_values($areSingles);

jQuery版本的@vishnu的答案。

if($('#testName').is(":checked")){
    $('#testNameHidden').prop('disabled', true);
}

如果您正在使用jQuery 1.5或以下版本，请使用.attr()函数而不是.prop()

我也喜欢这个解决方案，你只是发布一个额外的输入字段，使用JavaScript似乎有点hack对我来说。

取决于你使用什么你的后端将取决于哪个输入先去。

对于使用第一次出现的服务器后端(JSP)，您应该执行以下操作。

  <input type="checkbox" value="1" name="checkbox_1"/>
  <input type="hidden" value="0" name="checkbox_1"/>

对于使用最后一次出现的服务器后端(PHP、Rails)，您应该执行以下操作。

  <input type="hidden" value="0" name="checkbox_1"/>
  <input type="checkbox" value="1" name="checkbox_1"/>

对于服务器后端，其中所有事件都存储在列表数据类型([]，数组)中。(Python / Zope)

你可以按照你喜欢的任何顺序发布，你只需要尝试从输入中获得带有复选框类型属性的值。如果复选框在隐藏元素之前，列表的第一个索引如果复选框在隐藏元素之后，列表的最后一个索引。

对于一个服务器后端，所有发生的事件都用逗号连接(ASP。Net / iis) 您需要使用逗号作为分隔符来(拆分/分解)字符串，以创建列表数据类型。([])

现在，如果复选框在隐藏元素之前，您可以尝试获取列表的第一个索引，如果复选框在隐藏元素之后，则可以尝试获取列表的最后一个索引。

图片来源

为不同ID的复选框添加一个隐藏输入:

<input id='testName' type='checkbox' value='Yes' name='testName'>
<input id='testNameHidden' type='hidden' value='No' name='testName'>

在提交表单之前，根据检查的条件禁用隐藏输入:

form.addEventListener('submit', () => {
    if(document.getElementById("testName").checked) {
        document.getElementById('testNameHidden').disabled = true;
    }
}

Ajax动作的例子是(':checked')使用jQuery而不是.val();

            var params = {
                books: $('input#users').is(':checked'),
                news : $('input#news').is(':checked'),
                magazine : $('input#magazine').is(':checked')
            };

参数将得到TRUE或FALSE的值。