悬停时的Jquery不起作用

2022-01-22 00:00:00 hover jquery javascript html jquery-events

我正在更改我的代码以与 jQuery 1.8 兼容,但我被这个不起作用的 hover 所困扰.当我将同样的东西与 click 一起使用时,它起作用了.这是我的代码,谁能告诉我哪里出错了?

I'm changing my codes to be compatible with jQuery 1.8 and I'm stuck with this hover which doesn't work. When I used then same thing with a click it worked. Here is my code, can anyone tell me where I'm going wrong?

$(document).on('hover', '.top-level', function (event) {
  $(this).find('.actionfcnt').show();
  $(this).find('.dropfcnt').show();
}, function () {
  $(this).find('.dropfcnt').hide('blind', function () {
    $('.actionfcnt').hide();
  });
});

推荐答案

自 jQuery 1.8 起已弃用:名称hover"用作字符串mouseenter mouseleave"的简写.它为这两个事件附加了一个事件处理程序,处理程序必须检查 event.type 以确定事件是 mouseenter 还是 mouseleave.不要混淆悬停"伪事件名称和 .hover() 方法,后者接受一两个函数.

Deprecated as of jQuery 1.8: The name "hover" used as a shorthand for the string "mouseenter mouseleave". It attaches a single event handler for those two events, and the handler must examine event.type to determine whether the event is mouseenter or mouseleave. Do not confuse the "hover" pseudo-event-name with the .hover() method, which accepts one or two functions.

来源:http://api.jquery.com/on/#additional-notes

这几乎说明了一切,你不能使用悬停":

That pretty much says it all, you cant use "hover" for that:

$(document).on('mouseenter','.top-level', function (event) {
    $( this ).find('.actionfcnt').show();
    $( this ).find('.dropfcnt').show();
}).on('mouseleave','.top-level',  function(){
    $( this ).find('.dropfcnt').hide('blind', function(){
        $('.actionfcnt').hide();
    });
});

相关文章