121

.mouseover()jQuery和.hover()函数有什么区别？如果它们完全一样，为什么 jQuery 会同时使用它们？

4

5 回答 5

125

来自官方 jQuery 文档

  • .mouseover()
    将事件处理程序绑定到“鼠标悬停”JavaScript 事件，或在元素上触发该事件。

  • .hover() 将一个或两个处理程序绑定到匹配的元素，当鼠标指针 进入和离开元素时执行。

    调用$(selector).hover(handlerIn, handlerOut)是以下的简写： $(selector).mouseenter(handlerIn).mouseleave(handlerOut);

  • .mouseenter()

    绑定要在鼠标进入元素时触发的事件处理程序，或在元素上触发该处理程序。

    mouseover当指针移入子元素时mouseenter触发，而仅当指针移入绑定元素时触发。

这意味着什么

正因如此，.mouseover()不一样，同理不一样。.hover().mouseover().mouseenter()

$('selector').mouseover(over_function) // may fire multiple times

// enter and exit functions only called once per element per entry and exit
$('selector').hover(enter_function, exit_function)
于 2013-07-11T09:15:30.573 回答
32

.hover()function 接受两个函数参数，一个用于mouseenter事件，一个用于mouseleave事件。

于 2013-07-11T09:11:15.130 回答
9

您可以在 jQuery 文档页面上试用http://api.jquery.com/mouseover/ 。这是一个不错的小型交互式演示，它非常清晰，您可以亲自看到。

简而言之，您会注意到鼠标悬停事件发生在元素上方时 - 来自其子元素或父元素，但鼠标输入事件仅在鼠标从父元素移动到元素时发生。

于 2013-07-11T09:17:32.083 回答
2

来自官方文档：（http://api.jquery.com/hover/）

.hover() 方法绑定了 mouseenter 和 mouseleave 事件的处理程序。您可以使用它在鼠标位于元素内时简单地将行为应用于元素。

于 2013-07-11T09:12:27.857 回答
2

正如您可以在http://api.jquery.com/mouseenter/上阅读的那样

mouseenter JavaScript 事件是 Internet Explorer 专有的。由于事件的通用性，jQuery 模拟了这个事件，因此无论浏览器如何都可以使用它。当鼠标指针进入元素时，该事件被发送到元素。任何 HTML 元素都可以接收此事件。

于 2013-07-11T09:12:54.600 回答