jQuery“on”，鼠标悬停时执行“悬停”操作

Question

我有一个在悬停时执行的功能，但在鼠标输出时，它也会再次执行。为什么会这样做呢？

  $(element).on('hover', '.item', function () {})

Answer 1

jQuery的hover事件旨在用于悬停开始和结束时的通知。当您按照使用方式使用时，它会调用mouseenter和mouseleave的事件处理程序。

您可以检查处理程序中的event.type以查看事件触发时触发的事件，或者您可以切换到使用$(element).hover(fn1, fn2)并传递这两个函数。

来自jQuery doc for .on()：

  

在jQuery 1.8中不推荐使用，在1.9中删除：名称＆＃34; hover＆＃34;用作   字符串＆＃34; mouseenter mouseleave＆＃34;的简写。它附单   这两个事件的事件处理程序，处理程序必须检查   event.type，用于确定事件是mouseenter还是mouseleave。   不要混淆＆＃34;悬停＆＃34;使用.hover（）方法的伪事件名称，   它接受一个或两个功能。

因此，基本上，您不应该使用$(element).on('hover', ...);而是使用.hover()并传递两个事件处理程序或传递单个事件处理程序并检查event.type。