POST 未选中的 HTML 复选框
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/1809494/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
POST unchecked HTML checkboxes
提问by reach4thelasers
I've got a load of checkboxes that are checked by default. My users will probably uncheck a few (if any) of the checkboxes and leave the rest checked.
我有很多默认选中的复选框。我的用户可能会取消选中一些（如果有）复选框，而将其余复选框保持选中状态。
Is there any way to make the form POST the checkboxes that are notchecked, rather than the ones that arechecked?
有没有什么办法让表单POST所复选框不检查，而不是的那些被选中？
采纳答案by vishnu
Add a hidden input for the checkbox with a different ID:
为具有不同 ID 的复选框添加隐藏输入：
<input id='testName' type='checkbox' value='Yes' name='testName'>
<input id='testNameHidden' type='hidden' value='No' name='testName'>
Before submitting the form, disable the hidden input based on the checked condition:
在提交表单之前，根据选中的条件禁用隐藏输入：
if(document.getElementById("testName").checked) {
document.getElementById('testNameHidden').disabled = true;
}
回答by Sam
The solution I liked the most so far is to put a hidden input with the same name as the checkbox that might not be checked. I think it works so that if the checkbox isn't checked, the hidden input is still successful and sent to the server but if the checkbox is checked it will override the hidden input before it. This way you don't have to keep track of which values in the posted data were expected to come from checkboxes.
到目前为止，我最喜欢的解决方案是放置一个与可能未选中的复选框同名的隐藏输入。我认为它可以工作，如果未选中复选框，隐藏输入仍然成功并发送到服务器，但如果选中复选框，它将覆盖它之前的隐藏输入。这样您就不必跟踪发布数据中的哪些值预计来自复选框。
<form>
<input type='hidden' value='0' name='selfdestruct'>
<input type='checkbox' value='1' name='selfdestruct'>
</form>
回答by Marcel Ennix
I solved it by using vanilla JavaScript:
我通过使用 vanilla JavaScript 解决了这个问题：
<input type="hidden" name="checkboxName" value="0"><input type="checkbox" onclick="this.previousSibling.value=1-this.previousSibling.value">
Be careful not to have any spaces or linebreaks between this two input elements!
注意这两个输入元素之间不要有任何空格或换行符！
You can use this.previousSibling.previousSiblingto get "upper" elements.
您可以使用this.previousSibling.previousSibling来获取“上层”元素。
With PHP you can check the named hidden field for 0 (not set) or 1 (set).
使用 PHP，您可以检查命名隐藏字段的 0（未设置）或 1（设置）。
回答by SimonSimCity
My personal favorite is to add a hidden field with the same name that will be used if the check-box is unchecked. But the solution is not as easy as it may seems.
我个人最喜欢的是添加一个具有相同名称的隐藏字段，如果未选中复选框，将使用该字段。但解决方案并不像看起来那么容易。
If you add this code:
如果添加此代码：
<form>
<input type='hidden' value='0' name='selfdestruct'>
<input type='checkbox' value='1' name='selfdestruct'>
</form>
The browser will not really care about what you do here. The browser will send both parameters to the server, and the server has to decide what to do with them.
浏览器不会真正关心你在这里做什么。浏览器会将这两个参数发送给服务器，服务器必须决定如何处理它们。
PHP for example takes the last value as the one to use (see: Authoritative position of duplicate HTTP GET query keys)
例如，PHP 将最后一个值作为要使用的值（请参阅：重复 HTTP GET 查询键的权威位置）
But other systems I worked with (based on Java) do it the way around - they offer you only the first value. .NET instead will give you an array with both elements instead
但是我使用过的其他系统（基于 Java）是这样做的——它们只为您提供第一个值。.NET 相反会给你一个包含两个元素的数组
I'll try to test this with node.js, Python and Perl at sometime.
有时间我会尝试用 node.js、Python 和 Perl 来测试这个。
回答by Shailesh Kumar
A common technique around this is to carry a hidden variable along with each checkbox.
解决此问题的常用技术是在每个复选框中携带一个隐藏变量。
<input type="checkbox" name="mycheckbox" />
<input type="hidden" name="mycheckbox.hidden"/>
On the server side, we first detect list of hidden variables and for each of the hidden variable, we try to see if the corresponding checkbox entry is submitted in the form data or not.
在服务器端，我们首先检测隐藏变量列表，对于每个隐藏变量，我们尝试查看是否在表单数据中提交了相应的复选框条目。
The server side algorithm would probably look like:
服务器端算法可能如下所示：
for input in form data such that input.name endswith .hidden
checkboxName = input.name.rstrip('.hidden')
if chceckbName is not in form, user has unchecked this checkbox
The above doesn't exactly answer the question, but provides an alternate means of achieving similar functionality.
以上并没有完全回答这个问题，但提供了实现类似功能的替代方法。
回答by Rameez SOOMRO
you don't need to create a hidden field for all checkboxes just copy my code.
it will change the value of checkbox if not checked the valuewill assign 0and if checkbox checked then assign valueinto 1
您无需为所有复选框创建隐藏字段，只需复制我的代码即可。如果未选中，它将更改复选框的值，value将分配0，如果选中复选框，则分配value到1
$("form").submit(function () {
var this_master = $(this);
this_master.find('input[type="checkbox"]').each( function () {
var checkbox_this = $(this);
if( checkbox_this.is(":checked") == true ) {
checkbox_this.attr('value','1');
} else {
checkbox_this.prop('checked',true);
//DONT' ITS JUST CHECK THE CHECKBOX TO SUBMIT FORM DATA
checkbox_this.attr('value','0');
}
})
})
回答by Bart van Heukelom
You can do some Javascript in the form's submit event. That's all you can do though, there's no way to get browsers to do this by themselves. It also means your form will break for users without Javascript.
Better is to know on the server which checkboxes there are, so you can deduce that those absent from the posted form values ($_POSTin PHP) are unchecked.
您可以在表单的提交事件中执行一些 Javascript。这就是你所能做的，没有办法让浏览器自己做这件事。这也意味着您的表单对于没有 Javascript 的用户来说会中断。更好的是知道服务器上有哪些复选框，因此您可以推断$_POST未选中发布的表单值（在 PHP 中）中不存在的那些。
回答by Jeremy
$('input[type=checkbox]').on("change",function(){
var target = $(this).parent().find('input[type=hidden]').val();
if(target == 0)
{
target = 1;
}
else
{
target = 0;
}
$(this).parent().find('input[type=hidden]').val(target);
});
<p>
<input type="checkbox" />
<input type="hidden" name="test_checkbox[]" value="0" />
</p>
<p>
<input type="checkbox" />
<input type="hidden" name="test_checkbox[]" value="0" />
</p>
<p>
<input type="checkbox" />
<input type="hidden" name="test_checkbox[]" value="0" />
</p>
If you leave out the name of the checkbox it doesn't get passed. Only the test_checkbox array.
如果您省略复选框的名称，则不会通过。只有 test_checkbox 数组。
回答by desw
I would actually do the following.
我实际上会做以下事情。
Have my hidden input field with the same name with the checkbox input
让我的隐藏输入字段与复选框输入同名
<input type="hidden" name="checkbox_name[]" value="0" />
<input type="checkbox" name="checkbox_name[]" value="1" />
and then when i post I first of all remove the duplicate values picked up in the $_POST array, atfer that display each of the unique values.
然后当我发布我首先删除在 $_POST 数组中拾取的重复值，atfer 显示每个唯一值。
$posted = array_unique($_POST['checkbox_name']);
foreach($posted as $value){
print $value;
}
I got this from a post remove duplicate values from array
回答by N Zhang
"I've gone with the server approach. Seems to work fine - thanks. – reach4thelasers Dec 1 '09 at 15:19" I would like to recommend it from the owner. As quoted: javascript solution depends on how the server handler (I didn't check it)
“我已经采用了服务器方法。似乎工作正常 - 谢谢。-reach4thelasers 2009 年 12 月 1 日 15:19” 我想从所有者那里推荐它。引用：javascript 解决方案取决于服务器处理程序的方式（我没有检查它）
such as
如
if(!isset($_POST["checkbox"]) or empty($_POST["checkbox"])) $_POST["checkbox"]="something";
