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

Question

由于某种原因我的代码不起作用？！我需要选中复选框，如果所有复选框都“未选中”，则启用隐藏字段并将值发送到 db，这样我就可以确定复选框未选中。

问题 1：为什么我的 jquery 代码不起作用？

问题 2： 我需要将选中或未选中的值记录到 DB。我的计划是检查是否没有在 php.ini 中选择。这是一个好习惯吗？

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/

Answer 1

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

Answer 2

正如 Barmar 所说，ID 必须是唯一的。

接下来，使用.on() 而不是.bind() - 类似的语法，很容易做到。 （.bind 已弃用）

但是，要回答您的问题，您可以通过选中所有未选中的复选框并遍历它们来快速发现哪些复选框未选中。

如果您需要创建一个未选中复选框的列表，那么您需要每个复选框都具有独特性（如果房间里的每个人都被命名为“Bob”，那么列出所有棕色头发的男人的有用列表将很难）。为此使用 ID attr，如底部的 jsFiddle 示例所示。

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

jsFiddle here

Here is an expanded jsFiddle example 演示了如何根据您的帖子中的要求将未选中的复选框列表保存到隐藏字段中。

---

关于您的 jsFiddle，需要调整以下内容：

See revised 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 });

希望这会有所帮助。