jquery使用bind vs on click

Question

我在jquery中遇到了几种处理click事件的方法：

绑定：

$('#mydiv').bind('click', function() {
    ...
});

点击：

$('#mydiv').click(function() {
   ...
}

上：

$('mydiv').on('click', function() {
   ...
}

两个问题：

1. 他们还有其他方法吗？
2. 我应该使用哪一个，为什么？

更新：

正如eveyone提出的那样，我应该更好地阅读文档，并发现我应该使用：

on（）或click（），

这实际上是一回事。

但是，没有人解释为什么不再推荐bind？ 我可能会因为错过显而易见的地方而获得更多的支持，但我在文档中找不到这个原因。

UPDATE2：

'on'具有能够将事件处理程序添加到动态创建的元素的有用效果。 例如

$('body').on('click',".myclass",function() {
    alert("Clicked On MyClass element");
});

此代码为具有“myClass”类的元素添加了一个单击处理程序。 但是，如果稍后动态添加更多myClass元素，它们也会自动获得点击处理程序，而不必显式调用'on'。 据我所知，人们说，这也更有效（见下面的西蒙斯答案）。

Answer 1

从bind和click的文档中：

绑定 ：

从jQuery 1.7开始，.on（）方法是将事件处理程序附加到文档的首选方法。

源代码清楚地表明没有理由使用bind ，因为这个函数只调用更灵活on函数而不是更短：

bind: function( types, data, fn ) {
    return this.on( types, null, data, fn );
},

所以我建议，就像jQuery团队一样，忘记旧的bind功能，这个功能现在没用了。 它仅用于与旧代码的兼容性，它仍然在这里。

点击 ：

这个方法是.on（'click'，handler）的快捷方式

这个快捷方式当然不如on函数强大和灵活，并且不允许委派，但它允许您在应用时编写更短且可以说更易读的代码。 意见分歧在这一点上：一些开发商认为，应该避免，因为它仅仅是一个快捷方式，也有你需要替换它其实on ，只要你使用委托，那么为什么不直接使用on更一致？

Answer 2

对于你的第一个问题：还有.delegate ，它从jQuery 1.7开始被.on取代，但仍然是绑定事件处理程序的有效形式。

对于你的第二个问题：你应该像文档一样使用.on ，但是你也应该注意如何使用.on ，因为你可以在对象本身或更高级别的元素上绑定事件处理程序并将其委托为与.delegate 。

假设您有一个ul > li列表，并希望将鼠标悬停事件绑定到li 。 现在有两种方式：

• $('ul li').on('mouseover', function() {});
• $('ul').on('mouseover', 'li', function() {});

第二个是首选，因为有了这个，事件处理程序一次绑定到ul元素，jQuery将通过event.currentTarget （ jQuery API ）获取实际目标项，而在第一个示例中，它将它绑定到每个单独的列表元素。 此解决方案也适用于在运行时添加到DOM的列表项。

这不仅适用于parent > child元素。 如果页面上的每个锚点都有一个单击处理程序，则应该使用$(document.body).on('click', 'a', function() {}); 而不只是$('a').on('click', function() {}); 节省大量时间将事件处理程序附加到每个元素。

Answer 3

我认为你应该在发布这个问题之前搜索jquery文档 ：

从jQuery 1.7开始，.on（）方法是将事件处理程序附加到文档的首选方法。