即使是未选中的复选框,也会发送值

时间:2014-06-30 21:22:22

标签: jquery html checkbox

我有一个包含4个复选框的表单:

  <td>
    <input type="hidden" name = "all_post" value="0" checked>
    <input type="checkbox" name = "all_post" id = "all_post" value="1"> All Posts <br/>
    <input type="hidden" name = "others_post" value="0" checked> 
    <input type="checkbox" name = "others_post" id = "others_post" value="1"> Other's Posts <br/>
    <input type="hidden" name = "clients_post" value="0" checked>
    <input type="checkbox" name = "clients_post" id = "clients_post" value="1"> Cilent's Post <br/>
    <input type="hidden" name = "assigned_post" value="0" checked>
    <input type="checkbox" name = "assigned_post" id = "assigned_post" value="1"> Task Assigned 
  </td>

如果选中了复选框,我希望它返回&#34; 1&#34;但如果不加以检查,我希望它返回&#34; 0&#34;因此我有一个隐藏的复选框,名称相同。我的服务器处理复选框,它将发送隐藏和未隐藏的复选框值(&#34; 0&#34;,&#34; 1&#34;),我只想收到一个值。默认情况下会检查所有隐藏的复选框以发送&#34; 0&#34;但是我想这样做,如果选中未隐藏的复选框,则隐藏的复选框将被取消选中,因此只发送1个值。我该怎么做?

TL:DR 我想发送&#34; 0&#34;的值如果未选中某个选项且&#34; 1&#34;如果选中了一个选项

2 个答案:

答案 0 :(得分:0)

您需要use a radio button

以男/女为例。听起来你想让它回归男性或女性,而不是“0男性,1女性”。所以,使用单选按钮,

<form>
<input type="radio" name="sex" value="male">Male<br>
<input type="radio" name="sex" value="female">Female
</form>

这将使用户只能选择一个值,并返回一个值。复选框是您的错误形式。

答案 1 :(得分:0)

如果我理解您的问题,下面的代码可能会对您有所帮助。但是我不明白为什么你不仅要使用复选框和带有选中属性的隐藏输入,而且要反过来。

像这样更改HTML,因为您不需要隐藏的输入,因为您要使用名称验证数据,如果您想要的只是1或0,下面的代码可能对您有帮助。

更新小提琴:http://jsfiddle.net/eaVL3/2/

HTML:

<input type="checkbox" name = "all_post" id = "all_post" value="0"> All Posts <br/>
<input type="checkbox" name = "others_post" id = "others_post" value="0"> Other's Posts <br/>
<input type="checkbox" name = "clients_post" id = "clients_post" value="0"> Cilent's Post <br/>
<input type="checkbox" name = "assigned_post" id = "assigned_post" value="0"> Task Assigned 

使用Javascript:

$(function(){
    $(':checkbox').on('change', function() {
        if (this.checked == true)
            $(this).val("1"); 
        else
            $(this).val("0");
    });
});