3

私は ez-checkbox プラグインを使用しています。これは、チェックボックスを div にラップするだけで、チェックボックスの見栄えが良くなります。

<div class="ez-checkbox ez-checked">
  <input type="checkbox" checked autocomplete="off" class="ezmark ez-hide ez-init">
</div>

だから私はこれらの多くを持っており、クリックしてすべてをチェックしたい. 次のクリック ハンドラーのうち、パフォーマンスの観点から最適なものはどれですか。

まず、すべての入力を見つけ、すでにチェックされているものを除外し、各要素のクリックイベントをトリガーして、プラグインがその仕事を完了するようにします。

oPhotos
    .find('input')
        .not(':checked')
        .each(function() {
            $(this).click();
        });

2 番目 - 1 番目と同じですが、「チェック」作業は自分で行います。

oPhotos
    .find('input')
        .not(':checked')
        .each(function() {
            $(this)
                .prop('checked', true)
                .parent()
                    .addClass('ez-checked');
        });

3番目 - 現在がチェックされていない場合は、すべてのチェックボックスをループします - クリックをトリガーします。

oPhotos
    .find('input')
        .each(function() {
            if (! $(this).is(':checked')) $(this).click();
        });

4番目 - 現在のチェックボックスがチェックされていない場合は、すべてのチェックボックスをループします - 「チェック」ジョブを自分で行います。

oPhotos
    .find('input')
        .each(function() {
            if (! $(this).is(':checked')) {
                $(this)
                    .prop('checked', true)
                    .parent()
                        .addClass('ez-checked');
            }
        });
4

1 に答える 1

2

パフォーマンス テストを実行しました。より複雑なセレクターを使用し、.not()+ イベントをトリガーする代わりに + イベントを処理してアイテムをフィルタリングすることが最速のオプションであることが判明しました。最悪のオプションは、すべての要素をループしてそれらをフィルタリングし、イベントをトリガーすることです。

于 2013-07-10T08:53:26.563 に答える