Jquery-如何检查是否所有复选框都未选中


Jquery - How can I check if all of the checkboxes are unchecked?

由于某种原因,我的代码无法工作?!我需要选中复选框,如果所有复选框都"未选中",那么启用隐藏字段并将值发送到数据库,这样我就可以确定复选框是否未选中。

问题1:为什么我的jquery代码不起作用?

问题2:我需要将已检查或未检查的值记录到DB中。我的计划是检查php中是否没有选择。这是个好做法吗?

HTML

<tr class="more_info">
        <th valign="top">Other options:</th>
        {foreach from=$HTML_cOPTIONS key=dbname item=optname}
            {if ! empty($CARINFO[car].{$dbname})}
                <td><input type="checkbox" id="forced_checkbox" name="c_options[]" value="{$dbname}" checked/> {$optname} </br></td>
            {else}
                <td><input type="checkbox" id="forced_checkbox" name="c_options[]" value="{$dbname}"/> {$optname} </br></td>
            {/if}
        {/foreach}
        <input type="hidden" id="forceSendCheckBox" name="c_options[]" value="nocheckboxes"/>
        <input type="button" value="Check" id="check" />
    </tr>

Jquery

$('#check').bind('click',function()
{
    if ($('#forced_checkbox').filter(':not(:checked)').length == 0) {
        console.log('at least one checked');
        $("#forceSendCheckBox").prop('disabled',true);//do not send this field to DB
    } else {
        console.log('nothing checked');
        $("#forceSendCheckBox").prop('disabled',false);//send empty checkboxes
    }
});

更新

这是一把小提琴,好像还是坏了

http://jsfiddle.net/L5J96/

ID必须是唯一的。请改用类。

你的小提琴有几个问题。首先,您忘记了从菜单中选择jQuery框架,所以jQuery代码都不起作用。其次,您将过滤器从not(:checked)更改为(:checked),但没有将== 0更改为> 0。第三,如果没有not,过滤器选择器周围就不应该有括号。第四,您尝试使用.text()在输入字段中显示消息,但正确的方法是.val()

这是更正后的代码:

$('#check').on('click', function () {
    if ($('.forced_checkbox').filter(':checked').length > 0) {
        $('#forceSendCheckBox').val('at least one checked');
    } else {
        $('#forceSendCheckBox').val('nothing checked');
    }
});

FIDDLE

正如Barmar所提到的,ID必须是唯一的。

接下来,使用.on()而不是.bind()——类似的语法,所以很容易做到。(.bind已弃用)

但是,为了回答您的问题,您可以通过选择所有未选中的复选框并迭代它们来快速发现哪些复选框未选中。

如果你需要创建一个未选中复选框的列表,那么你需要每个复选框都有一些独特的东西(如果房间里的每个男人都叫"鲍勃",那么很难为所有棕色头发的男人列出一个有用的列表)。使用ID属性,如底部的jsFiddle示例所示。

$("input:checkbox:not(:checked)").each(function() {
    alert($(this).attr('id')); 
});

jsFiddle此处

下面是一个扩展的jsFiddle示例,演示了如何根据您的文章中的要求,将未选中的复选框列表保存到隐藏字段中。


关于您的jsFiddle,需要调整以下内容:

参见修订后的jsFiddle

  1. .on()语法的使用。改为使用.on(document).on(body)

    $('document').on('action', '#elementID', function() { //Do stuff here });

  2. 为了遍历未检查对象的集合,您应该使用jQuery的.each()方法。

    $('.forced_checkbox').filter(':not(:checked)').each(function() { //Do stuff });

希望这能有所帮助。