jQuery mousemove() 方法

jQuery 事件

mousemove()方法触发mousemove事件，或附加一个函数以在发生mousemove事件时运行。

当鼠标指针移到所选元素上时，将发生mousemove事件。

您可能会认为mousemove，mouseenter和mouseover事件是相同的，但它们不是：

mouseenter-仅在鼠标指针进入元素时调用
mousemove-当鼠标指针移到元素上时调用
mouseover-当鼠标指针进入元素及其子元素时调用（请参见下面的示例）

语法：

触发选定元素的mousemove事件：

$(selector).mousemove()

将函数附加到mousemove事件：

$(selector).mousemove(function)

示例

当mousemove事件触发时显示随机数：

示例

$("div").mousemove(function(){
  $(this).text(Math.random());
});

测试看看‹/›

获取鼠标指针在页面中的位置：

示例

$(document).mousemove(function(event){ 
  $("#output").text("pageX: " + event.pageX + ", pageY: " + event.pageY);
});

测试看看‹/›

当mousemove事件触发时更改背景颜色：

示例

$("div").mousemove(function(){
  $(this).css("background", randColor());
});

// 生成随机颜色函数
function randColor() {
  return 'rgb(' + Math.floor(Math.random()*256) + ',' + Math.floor(Math.random()*256) + 
  ',' + Math.floor(Math.random()*256) + ')';
}

测试看看‹/›

此示例演示mousemove，mouseenter和mouseover之间的区别：