在悬停时使用 on() - jQuery [英] using on() with hover - jQuery

问题描述

这就是我所拥有的:

$('#blah').hover(function(){
    $('etc').show();
}, function(){
    $('etc').hide();
});

这工作得很好，现在我希望上面的代码与 on() 方法一起工作:

This works just fine, now I want the exact above code working live with on() method:

$('#blah').on('hover', function(){
    $('#etc').show();
}, function(){
    $('#etc').hide();
});

但这不起作用，有人知道为什么吗?但这也有效:

But this is not working, anybody knows why? but also this works:

$('#blah').on('hover', function(){
    $('#etc').show();
});

当我使用 on() 方法时，回调函数不起作用，所以我将 mouseover() 和 mouseleave() 与 on() 一起使用并且它正在工作，我只是想知道为什么悬停回调不起作用使用 on()，这比使用 2 个事件更简单......

When I'm using on() method, the callback function is not working, so I'm using mouseover() and mouseleave() with on() and it's working, I just wanted to know why hover callback is not working with on(), that's so simpler than using 2 events....

谢谢

推荐答案

来自 JQuery源码，hover不包含在触发导致JQuery的事件列表中.on()

From the JQuery source code, hover is not included in the event list that triggered leading to JQuery .on()

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

这是因为 .hover() 只是 JQuery .mouseenter() 和 .mouseleave()

It is because .hover() is just a shortcut for JQuery .mouseenter() and .mouseleave()

jQuery.fn.hover = function( fnOver, fnOut ) {
    return this.mouseenter( fnOver ).mouseleave( fnOut || fnOver );
};

我希望这个简短的解释能提供一些指导.

I hope this brief explanation provides little guidance.

这篇关于在悬停时使用 on() - jQuery的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！