使用 jQuery 获取鼠标坐标

发布于 2024-09-18 08:39:19 字数 719 浏览 5 评论 0原文

我正在使用 jQuery 和元素构建一个突破游戏。为了控制桨，它将跟随鼠标。所以我需要在我的 drawPaddle() 方法中获取鼠标坐标。

在 jQuery 网站上查看，它有这样的示例：

$(document).mousemove(function(e){
    $('#status').html(e.pageX +', '+ e.pageY);
});

which do what I Want,但我不想像这样向我的项目添加另一个函数。这是我的 drawPaddle() 方法：

function drawPaddle() {
    c.beginPath();
    c.rect(paddleX, paddleY, 150, 10);
    c.closePath();
    c.fill();
    // Get mouse position and update paddleX and paddleY here
}

因此，我需要找到一种方法来在调用 drawPaddle() 时获取鼠标位置，而不是在鼠标移动时获取鼠标位置类似 $(document).mousemove(function(e){ 的页面 确实如此。

如有任何帮助，我们将不胜感激，谢谢。

原文

I am building a breakout game using jQuery and the <canvas> element. To control the paddle, it will follow the mouse. So I need to get the mouse co-ordinates in my drawPaddle() method.

Looking on the jQuery site it has examples like this:

$(document).mousemove(function(e){
    $('#status').html(e.pageX +', '+ e.pageY);
});

Which does what I want, but I don't want to add another function to my project like this. This is my drawPaddle() method:

function drawPaddle() {
    c.beginPath();
    c.rect(paddleX, paddleY, 150, 10);
    c.closePath();
    c.fill();
    // Get mouse position and update paddleX and paddleY here
}

So I need to find a way to get the mouse position whenever the drawPaddle() is called, and not whenever the mouse is moved on page like $(document).mousemove(function(e){ does.

Any help is appreciated, thanks.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

赠我空喜 2024-09-25 08:39:20

您需要执行

var where = {}
$('canvas').mousemove(function(e){
    where.x = e.pageX
    where.y = e.pageY;
});

然后在函数中使用 wherex,y

You will need to do

var where = {}
$('canvas').mousemove(function(e){
    where.x = e.pageX
    where.y = e.pageY;
});

and then use wherex,y in the function

回复收藏 0 原文

韬韬不绝 2024-09-25 08:39:20

$('canvas').mousemove(function(e){
    drawPaddle(e.pageX, e.pageY);
});


function drawPaddle(paddleX, paddleY) {
    c.beginPath();
    c.rect(paddleX, paddleY, 150, 10);
    c.closePath();
    c.fill();
}

$('canvas').mousemove(function(e){
    drawPaddle(e.pageX, e.pageY);
});


function drawPaddle(paddleX, paddleY) {
    c.beginPath();
    c.rect(paddleX, paddleY, 150, 10);
    c.closePath();
    c.fill();
}

回复收藏 0 原文