6

チェックボックスにiCheckプラグインを使用しています。そこに「すべて選択」機能を配置しました。構造：

  • すべて選択
  • チェックボックス 1
  • チェックボックス 2
  • チェックボックス 3

「すべて選択」をオンにすると、すべてのチェックボックスがオンになります。「すべて選択」のチェックを外すと、すべてのチェックボックスがオフになります。ただし、「すべて選択」にチェックを入れた後、いずれかのチェックボックスをオフにすると、その時点ではすべてのチェックボックスがチェックされていないため、「すべて選択」は自動的にオフになります。

これを作るために、私はこれを書きました：

$('#check-all').on('ifChanged', function(event){
    if($('.check').filter(':checked').length == $('.check').length) {
        $('#check-all').iCheck('check');
    } else {
        $('#check-all').iCheck('uncheck');
    }
    $('#check-all').iCheck('update');
});

しかし、このコードを配置した後、「すべて選択」がシングルクリックでは機能せず、複数回クリックする必要があるなど、チェックボックスが正常に機能しません。また、単一のチェックボックスがオフになっている場合、「すべて選択」はオフになりません。コードの問題は何ですか？正しく書くには？

フィドルワーク

4

1 に答える 1

18 
// Remove the checked state from "All" if any checkbox is unchecked
$('.check').on('ifUnchecked', function (event) {
    $('#check-all').iCheck('uncheck');
});

// Make "All" checked if all checkboxes are checked
$('.check').on('ifChecked', function (event) {
    if ($('.check').filter(':checked').length == $('.check').length) {
        $('#check-all').iCheck('check');
    }
});

ただし、処理$('#check-all').on('ifUnchecked', ...はトリッキーです-他の処理が起動され、すべてのチェックボックスがオフになります

フィドル

于 2015-02-27T20:46:12.807 に答える