"悬停”;在jQuery插件函数中不起作用,鼠标悬停并单击即可

"on.hover" not working in jQuery plugin function, mouseover and click do work

本文关键字:悬停 鼠标 不起作用 单击 函数 quot jQuery 插件      更新时间:2023-09-26

我遇到了一个奇怪的问题。我正在考虑写一个插件,所以我开始很热情。但当我遇到这个问题时,我的热情很快就消失了。首先我的代码:

(function ($) {
    $.fn.hoverme = function () {
        //Define default values
        var defaults = {
            color: 'inherited',
            size: ''
        }
        //Make the hover function
        $(this).on('hover', function () {
            var currentMousePos = {
                x: event.pageX,
                y: event.pageY
            }
            console.log(currentMousePos.x);
        })

    }
}(jQuery));

非常基本的东西。问题是:我无法让悬停在插件中工作。鼠标悬停、鼠标离开和所有其他事件都起作用。

我是不是错过了什么。

我这样调用插件:

$(document).ready(function () {
$('#element').hoverme();
})

小提琴

hover不是有效事件,但mouseentermouseleave是有效事件。

jQuery在以前的版本中确实支持hover事件,但不建议使用它,在新版本中它已被删除。

您应该使用mouseentermouseleave事件,因为您的插件名为$.fn.hover,所以实际上已经覆盖了jQuery的原生$.fn.hover方法。

如果你想在鼠标移动时捕捉它,你应该使用mousemove事件而不是

FIDDLE