Question

那么，就像问题指定的那样，是否有办法在jQuery中触发mousemove事件，该事件还将鼠标坐标发送到事件对象？

到目前为止，我的代码可以使用.trigger（事件）函数触发mousemove，但event.pageX和event.pageY是未定义的。

Answer 1

您需要在触发事件之前直接设置pageX和pageY。要设置这些属性，请创建一个jQuery.Event对象。

// create a jQuery event
e = $.Event('mousemove');

// set coordinates
e.pageX = 100;
e.pageY = 100;

// trigger event - must trigger on document
$(document).trigger(e);

See it in jsFiddle

Answer 2

我不相信可以通过JavaScript / jQuery按需获取鼠标坐标;但是，如果将位置绑定到全局变量，则可以随时在整个文档中访问它们，如下所示：

$(document).ready(function(){
   $().mousemove(function(e){
      window.xPos = e.pageX;
      window.yPos = e.pageY;
   }); 
});

对于CPU占用率较低的选项，您可以添加超时，但是在知道鼠标位置时稍微延迟交换性能：

function getMousePosition(timeoutMilliSeconds) {
    $(document).one("mousemove", function (event) {
        window.xPos = event.pageX;
        window.yPos = event.pageY;
        setTimeout("getMousePosition(" + timeoutMilliSeconds + ")", timeoutMilliSeconds);
    });
}
getMousePosition(100);

您现在应该可以使用任一解决方案从文档中的任何位置访问window.xPos和window.yPos，而无需触发虚假事件。

Answer 3

我不确定我完全理解这个问题。你可以这样做：

$('.someClass').mousemove(function(event){
    console.log(event.pageX);
    console.log(event.pageY);
});

现在，只要鼠标移过someClass，它就会注册xy cordinates。这是jsfiddle以查看它的实际效果和jquery documentation。

Answer 4

如果您要问的是鼠标，则无法移动鼠标。但是你可以使用你想要的任何上下文和参数来调用函数。 E.g：

function foobar(e)
{
  this.className = 'whatever'; // this == element
}

someElement.onmousemove = foobar;

var obj = {whatever:'you want'};
foobar.call(someElement, obj); // calls foobar(obj) in context of someElement

Answer 5

认为我知道你的问题。您正在尝试以编程方式查询鼠标位置。也许你有这样的代码：

$(document).one('mousemove.myModule', function (e) {
    // e.pageY and e.pageX is undefined.
    console.log('e.pageY: ' + e.pageY + ', e.pageX: ' + e.pageX); }
        ).trigger('mousemove.myModule');

那你就是对的。不会定义事件对象上的属性pageY和pageX。实际上，事件对象中存在很多东西，而不仅仅是.pageY和.pageX。可能是jQuery中的一些错误。无论如何，只是不要链接该调用以触发和来触发$（窗口）上的事件。不要问我为什么它有效，但对我来说它确实：

$(document).one('mousemove.myModule', function (e) {
    console.log('e.pageY: ' + e.pageY + ', e.pageX: ' + e.pageX); } );

// Now e.pageY and e.pageX will be defined!
$(window).trigger('mousemove.myModule');

Answer 6

这是我能想到的最好的，不会让你设置全局变量。 click事件仍会捕获坐标，因此您可以将该事件传递给您的mousemove。

$(element).click(function(e){
  $(element).trigger('mousemove',e);
});

然后，该事件对象将成为mousemove函数中的第二个参数;第一个是实际的mousemove事件或jQuery创建的事件。

$(element).mousemove(function(e,clickEvent){
  if typeof e.pageX === 'undefined' e = clickEvent;
  // or if you prefer, clickEvent.pageX;
});

有没有办法触发mousemove并获取event.pageX，event.pageY？

6 个答案: