jquery checkbox 復選框多次點擊判斷選中狀態,以及全選/取消的代碼示例

2015年12月21日 10:52:51 星期一

目標, 點擊當前的checbox, 判斷點擊后當前checkbox是否是選中狀態.

html:

<input type="checkbox" onclick="contracts_checkall()" id="contracts_checkall"> 全選

js: 

        var checkall = $("#contracts_checkall").attr('checked');
        var checkall_value1 = $("#contracts_checkall").val();
        var checkall_value2 = $('#contracts_checkall').is(':checked');
        console.log(checkall);
        console.log(checkall_value1);
        console.log(checkall_value2);

第一次點擊:

 undefined
 undefined
 on
 true

第二次點擊:

 undefined
 undefined
 on
 false

總結, 用is()方法可以判斷當前復選框的狀態, 即使沒有相關屬性

全選/取消全選

function contracts_checkall()
{
    var checkall = $('#contracts_checkall').is(':checked');
    $("input[name='contract[]']").each(
        function () {
            this.checked=checkall;
            // $(this).attr('checked', checkall); //第一次選中和取消是成功的, 再次選中就不起作用了
        }
    );
}

 

Finger PHP 框架