Javascript 如何在未选中复选框时提交 0,如果在 HTML 中选中复选框则提交 1

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/31367098/
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

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 06:36:34  来源:igfitidea点击:

How to submit 0 if checkbox is unchecked and submit 1 if checkbox is checked in HTML

javascriptphphtmlformscheckbox

提问by Rishabh Gusain

How to submit value 1 if a checkbox in a checkbox array is checked, and submit 0 if it's unchecked? I tried this but no luck. I am trying to grab this array in a php array when the form is submitted. Please help!

如果选中复选框数组中的复选框,如何提交值 1,如果未选中则提交 0?我试过这个,但没有运气。我试图在提交表单时在 php 数组中获取这个数组。请帮忙!

<input id = 'testName0' type = 'checkbox' name = 'check[0]' value = '1' checked>
<input id='testNameHidden0'  type='hidden' value='0' name='check[0]'>

<input id = 'testName1' type = 'checkbox' name='check[1]' value = '1' unchekced>
<input id='testNameHidden1'  type='hidden' value='0' name='check[1]'>

<input type = 'submit' value = 'Save Changes'>
>
<script>
if(document.getElementById('testName0').checked){
  document.getElementById('testNameHidden0').disabled = true;
}
</script>

<script>
if(document.getElementById('testName1').checked){
  document.getElementById('testNameHidden1').disabled = true;
}
</script>

回答by JungleZombie

Simplest one, no javascriptrequired, just put a hidden input before the checkbox:

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

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

Inputs need to have the same name. If the checkbox is checked then value 1 will be submitted, otherwise value 0 from the hidden input.

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

Your case javascript solution, no hidden inputs needed:

您的案例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>

PHP solution, no hidden inputs needed:

PHP 解决方案,无需隐藏输入:

<?php
    // if data is posted, set value to 1, else to 0
    $check_0 = isset($_POST['check'][0]) ? 1 : 0;
    $check_1 = isset($_POST['check'][1]) ? 1 : 0;
?>

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

回答by cmshnrblu

A better solution that solved this for me.

一个更好的解决方案为我解决了这个问题。

Problem: Both the hidden and the checked were sending to my server.

问题:隐藏的和检查的都发送到我的服务器。

Solution:

解决方案:

if len(key) == 1 {
  value = false
} else {
  value = true
}

This way, if len(key) is 1 I know that only the hidden field was being send. Any other scenario means that the box is checked. Simple and easy.

这样,如果 len(key) 是 1 我知道只有隐藏字段被发送。任何其他情况都意味着选中该框。简单易行。

回答by Abhi Das

Well I have a much more simple code that worked well for me:

好吧,我有一个更简单的代码,对我来说效果很好:

<input type="checkbox" value="true" id="checkBox">

Then the JQuery code:

然后是 JQuery 代码:

var checkBoxValue = $('#checkBox').is(':checked')?$('#checkBox').val():false

I used a ternary operatorto set the value on checked and unchecked condition.

我使用三元运算符在选中和未选中的条件下设置值。