无法获取未选中的复选框值

Question

我在 ASP.NET 模型中有一个 FieldItems 字典，该字典的值如下。

年龄 - 复选框，姓名 - 文本，公司 - 文本

在我的视图文件中，我根据字典中可用的键、值对创建控件。

<div class="row cloneMe">
    <table>
        @foreach (var item in Model.FieldItems)
        {
            <tr>
                @if (item.Value == "checkbox")
                {
                    <td>@item.Key</td>
                    <td> <input class="associationCheckbox" type="@item.Value" name="@item.Key" value="false" placeholder="@item.Key" /></td>
                }
                else if (item.Value == "number")
                {
                    <td>@item.Key</td>
                    <td> <input type="number" name="@item.Key" value="0" ng-required="true" placeholder ="@item.Key" /> </td>
                }
                else
                {
                    <td>@item.Key</td>
                    <td> <input type="text" name="@item.Key" value="" ng-required="true" placeholder ="@item.Key" /> </td>
                }
            </tr>
        }
    </table>
</div>


    <span>
        <button type="button" id="associationAdd" class="btn btn-success" style="float:none;cursor:pointer" ng-click="RemoveWidget()">AddPerson</button>
    </span>
    <span>
        <button type="button" id="associationRemove" class="btn btn-danger" style="float:none;cursor:pointer" ng-click="AddWidget()">Remove</button>
    </span>

添加到上一个，我可以使用下面的代码基于按钮单击来包含/删除所选字段。

$("#associationAdd").on("click", function () {
    $(".cloneMe:last").clone(true).insertAfter(".cloneMe:last");
});

$("#associationRemove").on("click", function () {
    if ($(".cloneMe").length > 1) {
        $(".cloneMe:last").remove();
    }
});;

在 ASP.NET 页面上添加控件后，我正在读取控件值。

    [HttpPost]
    public ActionResult Index(FormCollection formCollection)
    {
        foreach (var key in formCollection.Keys)
        {
            var value = formCollection[key.ToString()];
        }

    }

点击提交按钮后，我可以读取姓名和年龄值。但是，我只能获得选中的复选框值。 如果我有三个复选框并且都未选中，则复选框的键不会显示在 Acton Result 的 formCollection 中。

我尝试了以下方法来设置复选框状态但没有结果。

 $("input:checkbox[class=associationCheckbox]").each(function () {

        if ($(this).attr('checked')) {
            $(this).val('true');
        } else {
            $(this).val('false');
        }
    });

Answer 1

为了使用 jquery 选中复选框的属性：

$(this).prop('checked', true);

如果您使用的是 1.6 之前的 jquery 版本，请使用

$(this).attr('checked', 'checked');

要检查复选框是否被选中，请使用：

$(function() {
    $('.associationbox').on('click', function() {
        if ($('.associationbox').prop('checked')) {
            alert('checked');
        }
    });
});

JSFIDDLE