HTML5 + JavaScript - 마우스 위치 지정

Question

저는 HTML5에 대해 상당히 익숙하지만 학습 중이며 현재는 아주 간단한 게임을 진행하고 있습니다.

내가하려는 것은 캔버스와 관련된 마우스 X 및 Y 위치를 얻고 마우스를 따라갈 이미지 (예 : 십자선 모양)를 얻는 것입니다.

하지만 지금은 마우스 값만 가져오고 싶습니다.

그래서 모든 것을 초기화하는 init이라는 함수가 있습니다. 이미지 스프라이트를로드 할 때 그것은라고하십시오 'ommousemove이'맞다면

function init(){ 
    drawBg(); 
    startDrawing(); 

    document.addEventListener('keydown', checkKeyDown, false); 
    document.addEventListener('keyup', checkKeyUp, false); 

    document.addEventListener('ommousemove', mouseTarget, false); 

} 

나는, 내가 그들의 넣어 가정 해있어 확실하지 100 % 아니에요. 나는 다음 mouseTarget 기능이 있습니다

function mouseTarget(e){ 

    var mouseX; 
    var mouseY; 

    if(e.offsetX){ 
     mouseX = e.offsetX; 
     mouseY = e.offsetY; 
    } 
    else if(e.layerX){ 
     mouseX = e.layerX; 
     mouseY = e.layerY; 
    } 

    console.debug("Mouse X: " + mouseX + " Mouse Y: " + mouseY); 

} 

(매일 갱신) 매 5 프레임이라고, 그래서 내가 그 내에서 마우스 위치를 확인할 필요가 있으리라 믿고있어 나 또한 함수가 '그리기'라는 한

? catch되지 않은 : 형식 오류 :

function draw(){ 
    mouseTarget(); 
} 

는하지만 그때 나는 오류가 정의되지 않은 재산 'offsetX'을 읽을 수 없습니다. 여기서 내가 뭘 잘못하고 있니?

감사

Answer 1

(당신이 의심으로) 문제는 그것은 단지 이벤트 정보가 포함됩니다

document.addEventListener('mousemove', mouseTarget, false); 

mouseTarget 함수의 e 매개 변수를해야이 줄

document.addEventListener('ommousemove', mouseTarget, false); 

함께 이벤트를 통해 호출 될 때. 귀하의 경우 이벤트를 통해 호출되는 것이 결코 아니지만 draw 함수를 통해서만 호출됩니다. 당신은 당신이 무엇을해야 undefined.offsetX

에 액세스하려고하는 현실에 된대로 Cannot read property 'offsetX' of undefined. 오류가 발생하는 이유는

는

바로 '그릴'에서 그들을 참조 후 별도의 변수에 마우스 위치를 유지하고있다 기능.