Question

我经常看到如下代码：

$("#thing").on("mouseenter",function(){ Do stuff });

就个人而言，我几乎总是这样写：

$("#thing").mouseenter(function(){ Do stuff });

同样，我经常写

$("#thing").click(function(){})

但是我看到有人更正了（是的，我知道{1.7}比{1.7}更优先于on，所以它基本上是相同的偏好问题）：

bind

我做了什么“错误的”，我看不到这两个功能之间有很大差异吗？它总是似乎做我想做的事情，所以它从来都不是一个实际问题，但我有兴趣知道是否有一个我忽视的理论考虑。

Answer 1

不是真的，因为mouseenter函数调用on（如果没有参数调用trigger），它会快一点，如源代码中所示：

jQuery.each( ("blur focus focusin focusout load resize scroll unload click dblclick " +
    "mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave " +
    "change select submit keydown keypress keyup error contextmenu").split(" "), function( i, name ) {

    // Handle event binding
    jQuery.fn[ name ] = function( data, fn ) {
        return arguments.length > 0 ?
            this.on( name, null, data, fn ) :
            this.trigger( name );
    };
});

如您所见，许多事件都可以这样说。

就个人而言，当我不需要mouseenter的特殊功能时，我更喜欢使用click（或on等）功能：其中一大优势在我看来，使用jQuery是因为它使代码更简洁，更易读。而且我不认为你应该纠正，请问那些纠正你为什么这样做的人。

Answer 2

通常，.click或$.post等特定事件是快捷方式。它们与使用.on和$.ajax函数的行为相同，但后者通常具有更大的灵活性。 EG .on可以绑定到多个事件，而.click只能订阅点击次数。同样适用于$.ajax函数，还有更多选项，因为快捷方式设置了某些默认值。

Answer 3

两者之间没有实际区别，简写函数（.click()，.mouseover()等）调用.on()来实际绑定事件处理程序。直接使用.on()的唯一“好处”是你没有第二个函数调用的额外开销;我怀疑这可能是边缘性的，但这是一个非常不成熟的优化。

Answer 4

这不是必然的错误，但是它比正常方式更有优势。

通过将事件“绑定”到父容器$(parent).on(event, target, function() { //foobar });，您可以将新的目标元素添加到容器中，而不必重复jquery来绑定事件。

在$（）。mouseenter（function（）{}）上使用jQuery $（）。on（'mouseenter'，function（）{}）是否有优势？

4 个答案: