如何检测鼠标仅在水平移动时移动（向左或向右移动）

Question

您可以请看看This Demo并让我知道如何在鼠标移动到左侧或右侧时检测mousemove()？

基本上现在发生的事情是，即使当鼠标从上到下或向下移动到顶部时，jquery检测到mousemove事件，但我需要禁用此功能并在水平移动时检测鼠标移动事件。

$("#target").mousemove(function(event) { 
 
    var msg = "Handler for .mousemove() called at "; 
 
    msg += event.pageX + ", " + event.pageY; 
 
    $("#log").append("<div>" + msg + "</div>"); 
 
});

#target{width:500px; height:120px; background:yellow;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="target"> 
 
    Move here 
 
</div> 
 
<div id="other"> 
 
    Trigger the handler 
 
</div> 
 
<div id="log"></div>

Answer 1

记录鼠标的最后一个位置，如果水平位置发生了变化，运行代码。

var lastX = 0; 
 

 
$("#target").mousemove(function(event) { 
 
    if(lastX != event.pageX) { 
 
    var msg = "Handler for .mousemove() called at "; 
 
    msg += event.pageX + ", " + event.pageY; 
 
    $("#log").append("<div>" + msg + "</div>"); 
 
    } 
 
    lastX = event.pageX; 
 
});

#target{width:500px; height:120px; background:yellow;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="target"> 
 
    Move here 
 
</div> 
 
<div id="other"> 
 
    Trigger the handler 
 
</div> 
 
<div id="log"></div>