onmouseleave는 onmousemove 내에서 작동하지 않습니다.

div은 onmousemove이고 커서를 따라 객체를 만드는 데 사용합니다. 이 내에서 divdiv은 onmouseleave입니다. 문제는 onmouseleave이 매우 빠르게 개체에서 커서를 이동하는 경우에만 작동한다는 것입니다. 그러나 onmousemove을 제거하면 onmouseleave이 올바르게 작동하기 시작합니다. onmousemove과 onmouseleave을 동시에 작동 시키려면 어떻게해야합니까?onmouseleave는 onmousemove 내에서 작동하지 않습니다.

html로 :

<body> 
    <div onmousemove="cursorMove(event)" id="main"> 
     <p id="title">...</p> 
     <div onmouseleave="gameOver()" id="light"></div> 
     <div id="cursor"></div> 
    </div> 
    <button onclick="moveLight()">move</button> 
    <button onclick="startGame()">start</button> 
    <script src="js/javascript.js"></script> 
</body>

자바 스크립트

function cursorMove(event) { 
    document.getElementById("cursor").style.top = event.clientY - 14; 
    document.getElementById("cursor").style.left = event.clientX - 14; 
    document.getElementById("cursor").style.opacity = '1'; 
} 
function gameOver() { 
    console.log("Game Over"); 
    document.getElementById("light").style.top = 245 + 'px'; 
    document.getElementById("light").style.left = 238 + 'px'; 
    document.getElementById("title").style.opacity = '1'; 
    document.getElementById("title").innerHTML = 'Enter the light'; 
    gameActive = false; 
}

출처

2016-12-03 Thalliium_

내부로 시도 : onmousemove 진영이 함수는 mousemove

function cursorMove(event) { 
    document.getElementById("light").onmouseleave(); 
}

또는

의 시간에 실행된다

<div onmousemove="cursorMove(event),gameOver()" id="main">

출처

2016-12-03 14:46:40 prasanth

전체 스크립팅 코드를 모르겠다. 그러나이 코드는 비전문 컨텍스트에서 cursorMove 및 gameOver 함수를 호출하려고 시도한다고 생각합니다. 인라인 이벤트 처리기를 사용하고 함수가 윈도우 실행 컨텍스트에 있어야합니다.

다른 방법을 시도해보십시오. 예 : https://jsfiddle.net/4hkkm7k5/.

게다가 인라인 이벤트 처리기는 좋은 생각이 아닙니다. 참조 : https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Building_blocks/Events#Inline_event_handlers_%E2%80%94_don 't_use_these

출처

2016-12-03 14:48:29

인라인 이벤트를 addEventListner로 바꾸려고했지만 불행히도 아무런 차이가 없었습니다. –

예를 수정했습니다 : https://jsfiddle.net/4hkkm7k5/1/ –

onmouseleave는 onmousemove 내에서 작동하지 않습니다.

답변

관련 문제