Ottenere coordinate del mouse utilizzando jQuery

Question

Sto costruendo un gioco di breakout utilizzando jQuery e l'elemento <canvas>. Per controllare la pagaia, seguirà il mouse. Così ho bisogno di ottenere le coordinate del mouse nel mio metodo drawPaddle().

Guardando sul sito di jQuery ha esempi in questo modo:

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

Il che fa quello che voglio, ma io non voglio aggiungere un'altra funzione al mio progetto come questo. Questo è il mio metodo drawPaddle():

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

Così ho bisogno di trovare un modo per ottenere la posizione del mouse ogni volta che il drawPaddle() si chiama, e non ogni volta che il mouse viene spostato a pagina come $(document).mousemove(function(e){ fa.

Ogni aiuto è apprezzato, grazie.

Answer 1

$('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();
}

Answer 2

Sarà necessario fare

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

e quindi utilizzare WhereX, y nella funzione

Answer 3

penso che ci sia alcun modo per farlo senza un evento. Non conosco campo in JavaScript che memorizza le informazioni a livello globale. Qualche tempo fa ho avuto lo stesso problema e ha fatto che con l'evento mousemove perché ho trovato altra soluzione. Forse qualche navigatore implementare un modo per ottenere quelle coordinate, ma non so.

Ma forse è possibile utilizzare mouseenter ed eventi mouseleave sulla tela per abilitare / disabilitare la cattura posizione del mouse. Ciò ridurrà il di chiamate di funzione.