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();
        });

第二 - 与第一个相同，但我们自己做“检查”工作。

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

第三 - 循环所有复选框，如果当前未选中 - 触发点击。

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

第四 - 循环所有复选框，如果当前未选中 - 我们自己做“检查”工作。

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 回答