當jQuery中沒有選中復選框時，按鈕禁用

Question

選擇復選框時，我無法使用禁用按鈕。 Multicheck正在運行，但是如果我有兩個或多個項目，則選擇全部，然后取消選擇其中一項，然后該按鈕再次禁用。 請幫我。

這是我的代碼：

<input type='submit' id='delete-button' class="delete-button" disabled="disabled">

<input type="checkbox" id="check-all"name="deleteall" value="checkbox-all">

<input type='checkbox' class='checkSingle' id='checkbox' name='check_list[]'>
<input type='checkbox' class='checkSingle' id='checkbox' name='check_list[]'>
<input type='checkbox' class='checkSingle' id='checkbox' name='check_list[]'>
<input type='checkbox' class='checkSingle' id='checkbox' name='check_list[]'>
<input type='checkbox' class='checkSingle' id='checkbox' name='check_list[]'>

和jQuery代碼：

(function ( $ ) {
    $( 'document' ).ready( function() {
        $('.checkSingle').on ("click", function() {
            if ($(this).is(':checked')) {
                $("#delete-button").removeAttr('disabled');
            } else {
                $('#delete-button').attr('disabled', 'disabled');
            }
        });
        $('#check-all').change(function () {
            if (this.checked){
                $("#delete-button").removeAttr('disabled');
                $(".checkSingle").each(function() {
                    this.checked=true;
                })
            } else {
                $(".checkSingle").each(function() {
                    $('#delete-button').attr('disabled', 'disabled');
                    this.checked=false;
                })
            }
        });
        $(".checkSingle").click(function () {
            if ($(this).is(":checked")) {
                var isAllChecked = 0;
                $(".checkSingle").each(function() {
                    if(!this.checked)
                        isAllChecked = 1;
                })
                if(isAllChecked == 0) {
                    $("#check-all").prop("checked", true);
                }
            } else {
                $("#check-all").prop("checked", false);
            }
        });
    });
})( jQuery );

Answer 1

這應該可以解決問題，如果您遍歷所有元素，則需要檢查是否選中了一個元素，然后將按鈕設置為活動（如果未選中），然后將其禁用。

(function ( $ ) {
$( 'document' ).ready( function() {
    $('#check-all').change(function () {
        if (this.checked){
            $("#delete-button").removeAttr('disabled');
            $(".checkSingle").each(function() {
                this.checked=true;
            })
        } else {
            $(".checkSingle").each(function() {
                $('#delete-button').attr('disabled', 'disabled');
                this.checked=false;
            })
        }
    });
    $(".checkSingle").click(function () {
        if ($(this).is(":checked")) {
            var isAllChecked = 0;
            $(".checkSingle").each(function() {
                if(!this.checked)
                    isAllChecked = 1;
            })
            if(isAllChecked == 0) {
                $("#check-all").prop("checked", true);
            }
        } else {
            $("#check-all").prop("checked", false);
        }
        var checked = false;
        $(".checkSingle").each(function() {
            if(this.checked){
                checked = true;
            }
        });

        if(checked){
            $("#delete-button").removeAttr('disabled');
        } else {
            $('#delete-button').attr('disabled', 'disabled');
        }
    });
});
})( jQuery );