최근에 나는 HTML5 게임 프레임워크를 작성했습니다. 오늘은 다계층 클릭 이벤트 모니터링에 대해 글을 썼습니다. 꽤 재미있을 것 같아요. 그래서 모듈에서 추출되었습니다. 다음 코드는 단지 몇 가지 아이디어일 뿐입니다. 구체적인 구현은 확실히 그다지 추악하지는 않습니다 코드 복사 코드는 다음과 같습니다. ;문서 <br>.box > 캔버스 { <br>위치: 절대 <br> 🎜> <br>function getRect(obj) { <br>var x1 = obj.offsetLeft; <br>var y1 = obj.offsetTop; <br>var x2 = x1 obj.offsetWidth; <br>var y2 = y1 obj.offsetHeight ; <br>return { <br>x1: x1, <br>y1: y1, <br>x2: x2, <br>y2: y2 <br>} <br>function inside(x, y, ret) { <br>if(x>direct.x1 && x<ect.x2 y y<direct.y2) { <br />return true <br /> } <br />else { <br />return false; <br />} <br />} <br />var Trigger = {}; <br />trigger.list = [] <br />trigger.listen = function() <br />var list = Trigger.list; <br />document.addEventListener('click',function(evt) { <br />for(var i=0; i<list.length; i) { <br />list[ i](evt); <br />}); <br />trigger.listen() <br />var l1 = document.getElementById('layer1'); = document.getElementById(' layer2'); <br />var dl1 = function(evt) { <br />if(inside(evt.clientX, evt.clientY, getRect(l1))) { <br />console.log( '클릭'); <br />} <br />} <br />trigger.list.push(dl1); <br />var dl2 = function(evt) { <br />if(inside(evt.clientX, evt.clientY) , getRect(l2)) ) { <br />console.log('click2') <br />} <br />} <br />trigger.list.push(dl2) <br />>
