如何点击不确定复选框以“检查”状态

时间:2013-05-22 17:01:11

标签: jquery

我试图按照这个线程建议解决check indeterminate states

我正在使用ASP.NET,似乎单击一个处于不确定状态的复选框将取消选中它,而不会触发任何事件(底层复选框实际上是'未选中')。当我点击一个处于不确定状态的复选框时,我正在考虑让Javascript检查它(更喜欢逻辑,这应该解雇我的ASP.NET事件)。

$(document).ready(function () {
    $(".UndefinedCheckboxState :checkbox").prop("indeterminate", true);

    $(":checkbox").click(function () {
        if ($(this).prop("indeterminate")) {
            $(this).prop("indeterminate", false);
            $(this).prop("checked", true);
        }
    });
});

更新:点击事件正常,但if中的条件永远不会成立!我一直点击不确定状态的复选框......

3 个答案:

答案 0 :(得分:10)

事实证明,如果单击的复选框具有不确定状态,则通过click事件中的第一条指令,该属性已经消失。

我已经取代了我的逻辑来测试尚未消失的东西:

<script type="text/javascript">
    $(document).ready(function() {
        $(".UndefinedCheckboxState :checkbox").prop("indeterminate", true);

        $(":checkbox").click(function () {
            if ($(this).closest("span").hasClass("UndefinedCheckboxState")) {
                $(this).prop("indeterminate", false);
                $(this).prop("checked", true);
            }
        });
    });
</script>

答案 1 :(得分:2)

扩展@ adeneo的答案,试试这个:

$(document).ready(function () {
    $(".UndefinedCheckboxState input[type='checkbox']").prop("indeterminate", true);

    $("input[type='checkbox']").on('click', function () {
        console.log('changed');
        console.log('current value: '+$(this).prop('checked') );  
    });
});

查看Fiddle

答案 2 :(得分:0)

只需使用is()

$(document).ready(function () {
    $(".UndefinedCheckboxState :checkbox").prop("indeterminate", true);

    $(":checkbox").click(function () {
        if ($(this).is(":indeterminate")) {
            $(this).prop("indeterminate", false);
        }
        $(this).prop("checked", true);
    });
});