jquery - 当鼠标向上而不是向下移动时，如何在 jQuery 中使用 e.pageY 来执行事件？

Question

好的，我正在尝试在 jQuery 中创建一个事件，以检测鼠标何时向上移动。我正在使用 e.pageY 事件。所以在这种情况下，我希望在鼠标的 Y 位置小于 2 时发生事件。我已经成功地做到了。这是代码。

$(document).mousemove(function(e){ 

    if (e.pageY <= 2){

       $('#mystuff').show();

    });

 });

现在的问题是当我打开页面并向下移动鼠标时，#mystuff 显示，因为鼠标经过的位置小于 2。

我只希望#mystuff 在鼠标向上移动而不是向下移动时显示。

我希望你明白这一点。

谢谢。

Answer 1

尝试这样的事情。

var mouseLastYPos = null;
$(document).mousemove(function(e){ 
    if(mouseLastYPos){ 
        if (e.pageY < mouseLastYPos && e.pageY <= 2){

           $('#mystuff').show();

        }
    }
    mouseLastYPos = e.pageY;
});​

工作演示 - http://jsfiddle.net/bmHbt/

Answer 2

$(document).mousemove(function(e){ 
    var prevY = $('#mystuff').attr('data-prevY') || 0;
    if (e.pageY <= prevY){
       $('#mystuff').show();
    }
    else {
        $('#mystuff').hide();
    }
    $('#mystuff').attr('data-prevY', e.pageY);
 });

使用工作示例检查此 JSFiddle 。

Answer 3

我认为没有内置方法可以检测鼠标的移动方式，但您可以使用隐藏字段值来解决问题，该值存储鼠标位置并比较先前的位置，如下所示：

if ($('#hiddenMousePos').val() > e.pageY){
    //Your code here
}
$('#hiddenMousePos').val(e.pageY);

并将默认值设置hiddenMousePos为0。这样它只会在前一个e.pageY大于实际值的情况下进入条件。