我有一个 html 表单，我希望总是有复选框来提交一个值。我怎样才能做到这一点？我有一个想法，但我还没有尝试过，我不确定它是否是最好的方法（jquery 检查是否选中了该框，然后将值设置为 0/1 并将其选中，以便提交）
【问题讨论】：
感谢@Lazarus' idea，也被@BalusC提到，您可以在表单中添加额外的控件：
<input type="hidden" name="checkbox1" value="off">
<input type="checkbox" name="checkbox1" value="on"> My checkbox
复选框和隐藏字段必须同名。隐藏的输入总是作为默认值提交。如果复选框被选中，那么它也被提交。所以你有一个参数“checkbox1”的2个值的列表，你必须在服务器端处理。
...也许<select> 标签会更方便。
【讨论】：
off（如果复选框已关闭）或复选框中覆盖的on？
要求这样的事情是有正当理由的，尽管这里设想的行为不是正确的方法。正确使用复选框时存在问题在编辑现有数据时，这就是无法确定是否没有提交值是因为表单上不存在该字段还是因为用户清除了所有的值。有条件地包含字段时，您随时可能遇到此类问题。
当然，维护“视图状态”可能会遇到麻烦，但只要复选框或使用多个选项进行选择（当所有选择都被排除在清除）显示。该字段应具有相关但不同的名称（可以从中提取实际字段名称的名称）。自（我相信）版本 7 以来，Lotus Domino 服务器已出于此目的使用名为 %%Surrogate_FieldNameHere 的字段，这正是我在此处描述的原因。
【讨论】：
说实话，这感觉像是一个很大的禁忌。
不管怎样：
<script type="text/javascript">
$(document).ready(function () {
$('form').submit(function() {
$(this).find('input[type=checkbox]').each(function () {
$(this).attr('value', $(this).is(':checked') ? '1' : '0');
$(this).attr('checked', true);
});
});
});
</script>
【讨论】：
HTML 不是这样工作的。 HTML 复选框为specified，如下所示：如果选中，则其name=value 将作为请求参数发送。如果未选中，则其name=value 将不作为请求参数发送。请注意，当 value 未指定时，大多数浏览器默认为“开启”。如果您为所有复选框提供相同的name，但使用不同且固定的value，会更容易。这样您就可以将选中的作为数组/集合获取。
如果所有复选框在服务器端都是预先知道的，您可以应用基本数学来获得未选中的复选框：
uncheckedCheckboxes = allCheckboxes - checkedCheckboxes
如果这些复选框是在客户端动态创建的，因此在服务器端事先未知，则为每个复选框添加一个 <input type="hidden"> 字段，其中包含有关动态创建的复选框的信息，以便服务器端知道哪些复选框都存在作为提交的时刻。
【讨论】：
虽然这违反了 HTML 规范，但如果您知道自己在做什么，使用它您不再需要处理提交时处理完全不同的复选框 - 例如命名字段 with_brackets[] 实际上可以使用。
$(document).on('submit', 'form', function() {
$(this).find('input[type=checkbox]').each(function() {
var checkbox = $(this);
// add a hidden field with the same name before the checkbox with value = 0
if ( !checkbox.prop('checked') ) {
checkbox.clone()
.prop('type', 'hidden')
.val(0)
.insertBefore(checkbox);
}
});
});
注意：未选中的复选框现在提交的值为"0"
另外，如果你只想改变单个表单的行为，只需修改上面sn-p中的第一行：
$(document).on('submit', 'form.your-class-name', function() {
// ...
});
【讨论】：
如果你有很多复选框，你可以试试这个代码：
<input type="checkbox" onclick="$(this).next().val(this.checked?1:0)"/> <input type="hidden" name="checkbox1[]"/>
【讨论】：
如果您有以下 HTML：
<form id="myform" method="post" action="my/url">
<input type="checkbox" id="checkbox1" name="checkbox1"/>
<input type="checkbox" id="checkbox2" name="checkbox2"/>
<input type="checkbox" id="checkbox3" name="checkbox3"/>
</form>
普通表单提交：
在提交表单时，在提交之前，根据复选框是未选中还是选中，将复选框的所有值更改为 0 和 1。像这样：
$('#myform').submit(function() {
var $checkboxes = $('#myform').find('input[type="checkbox"]');// Select all checkboxes
$checkboxes.filter(':checked').val(1);// Set value to 1 for checked checkboxes
$checkboxes.not(':checked').val(0);// Set value to 0 for unchecked checkboxes
$checkboxes.prop('checked', true);// Change all checkboxes to "checked" so all of them are submitted to server
});
注意：这段代码的丑陋之处在于，在提交表单时，所有复选框都会暂时显示为“已选中”。但是如果你对ajax表单提交应用相同的概念，那就更好了。
AJAX 表单提交：
$.post('my/url', {
'checkbox1': $('#checkbox1').is(':checked') ? 1 : 0,
'checkbox2': $('#checkbox2').is(':checked') ? 1 : 0,
'checkbox3': $('#checkbox3').is(':checked') ? 1 : 0
}, function(response) {
// Server JSON response..
}, 'json');
【讨论】：