javascript - 我应该在单个或单独的调用中在 $(document) 上设置多个元素绑定(bind)吗？

Question

我正在尝试清理和改进一些代码。有一个相当大的片段将多个事件附加到 $(document) ，如下所示:

$(document).on('eventA.nameA', '#pageA', function(){
    // do sth
});

$(document).on('eventB.nameB', '#pageB', function(){
    // do sth
});

$(document).on('eventC.nameC', '#pageC', function(){
    // do sth
});

所以基本上所有的事件绑定(bind)都直接在文档上。

问题:

是否有限制(我发现大约 50 个单独的文档绑定(bind))以及在单个选择器上设置此限制的优点/缺点是什么:

$(document)
    .on('eventA.nameA', '#pageA', function(){
        // do sth
    })
    .on('eventB.nameB', '#pageB', function(){
        // do sth
    })
    .on('eventC.nameC', '#pageC', function(){
        // do sth
    });

大多数绑定(bind)都是特定于页面的(它是一个 Jquery Mobile 应用程序，因此一旦将页面拉入 DOM，其绑定(bind)就会像这样设置)。因此实际上没有其他地方可以放置这些绑定(bind)，因为在 $(document) 持续存在时将被拉入和拉出。

感谢您的意见!

Answer 1

将它们放在单个选择器上的优点是，您可以避免每次调用 $(document) (这样的开销较小，因为 $(document) 得到缓存)。缺点是它们必须一个接一个地排列，并且您将它们缩进一级。这其实并不重要。

重要的是，如果这些选择器接近真实的选择器，那么在 document 上使用 ID 选择器的委托(delegate)可能真的很浪费。只需等到文档准备就绪，或者在元素更新时更新事件处理程序 - 特别是如果所有这些元素实际上不会同时存在于同一页面上。如果选择器实际上比这更复杂，请忽略本段:-)