Html 复选框，多个具有相同的“名称”。如果选中，则值为 1，如果未选中，则值为 0答案

【问题标题】：Html Checkbox, multiple with same 'name'. Value 1 if checked, Value 0 if not checkedHtml 复选框，多个具有相同的“名称”。如果选中，则值为 1，如果未选中，则值为 0
【发布时间】：2019-09-06 07:33:56
【问题描述】：

在我的页面上，我有一个包含“添加行”按钮的表格，因此用户可以根据需要添加更多行。该行是通过克隆表中的最后一行来添加的。在该行中，我想放置两个复选框。

<td class = ''> <input class = '' type='checkbox' name ='installed_by_cm' value='1'/>  </td>
<td class = ''> <input class = '' type='checkbox' name ='installed_after_cm' value='1'/>  </td>

这意味着有多个具有相同“名称”标签的复选框，这是我稍后在代码中处理数据时需要的。我使用烧瓶request.form.getlist() 来获取python 后端的信息。

由于复选框类型默认为无，我不能使用隐藏输入，因为它总是由请求收集，我无法找到一种方法让复选框在选中时发送 1，在未选中时发送 0 .任何帮助将不胜感激。

【问题讨论】：

您需要将名称更改为基于数组的名称，例如name="installed_by_cm[]" 否则复选框将相互覆盖。大多数情况下，我会使用标识符，例如 name="installed_by_cm[<?= $id ?>]"（PHP 中的示例）

标签： javascript html python-3.x flask

【解决方案1】：

最简单的一种，不需要javascript，只需在复选框前放置一个隐藏输入：

<input type="hidden" name="check[0]" value="0" />
<input type="checkbox" name="check[0]" value="1" />

输入需要具有相同的名称。如果选中该复选框，则将提交值 1，否则来自隐藏输入的值 0。

您的案例 javascript 解决方案，无需隐藏输入：

<script type="text/javascript">
    // when page is ready
    $(document).ready(function() {
         // on form submit
        $("#form").on('submit', function() {
            // to each unchecked checkbox
            $(this + 'input[type=checkbox]:not(:checked)').each(function () {
                // set value 0 and check it
                $(this).attr('checked', true).val(0);
            });
        })
    })
</script>

<form method="post" id="form">
    <input type="checkbox" name="check[0]" value="1" />
    <input type="checkbox" name="check[1]" value="1" />
    <input type="submit" value="Save Changes" />
</form>

【讨论】：