2017-12-13 29 views
0

자바 스크립트를 사용하며 HTML5 게임을 만들고 있습니다.자바 스크립트를 사용하여 html 만 사용 가능

나는 물건을 사기 위해 버튼을 사용하고 있습니다. 안타깝게도 내 버튼에는 ontouchstart='function()'을 사용할 수 없으므로 터치 이벤트 리스너를 사용하고 사용자가 버튼을 탭할 때까지 기다리고 있습니다 (버튼의 ID로 지정). 내가 사과 때문에 (내가 폰갭으로 아이폰 기가에서 테스트하고하는) 사용자가 천천히 버튼을 탭하면, 그것은 초기 탭 기능 (1를 추가 할 것이라고이 300ms 지연을 가지고, 나타났습니다 무엇

document.addEventListener("touchstart", function() { 
    if (event.target.id === "button") { 
     clicks++; 
    } 
} 

총 클릭 수), 버튼을 두 번 클릭 한 것처럼 다시 기능을 수행합니다. 나는 사용자가 스마트 폰 대신 컴퓨터를 가지고있는 "클릭"에 대해서만 다른 이벤트 리스너를 가지고 있기 때문에 이것을 기대할 수 있습니다.

내가 원하는 것은 두 번째 클릭을 사용 중지하는 방법입니다.

기본적으로 클릭 수는 1 (0에서 1까지) 올라가고 버튼에 클릭 애니메이션이 표시되고 총 클릭 수는 1에서 2로 1 위로 증가합니다. touchstart 이벤트 리스너가 초기 추가 작업을 수행하고 있습니다 (원하는 작업). 그런 다음 버튼을 두드리는 것의 부작용은 추가 사용자 입력없이 버튼을 두 번 클릭하는 것입니다.

두 번째 클릭 부분을 사용 중지하는 방법을 찾고 싶지만 탭을 유지하고 싶습니다.

은 어쩌면 같은 뭔가를해야만 : 필요하다면 내가 잘 설명 바랍니다

document.addEventListener("touchstart", function() { 
    // disable 2nd click or clicking all together, only allowing touch events 
     clicks++; 
    } 
} 

은 더 많은 질문을 주시기 바랍니다.

답변

0

먼저 @https://developers.google.com/web/updates/2013/12/300ms-tap-delay-gone-away으로 -이 300ms 문제를 회피하지 않았습니다. 이 경우

는 경우가 아니라, 당신은, 어쩌면

let lastclick = + new Date() 
let clicks = 0 

document.addEventListener("touchstart",() => { 
    if (+ new Date() - 100 > lastclick) { 
    clicks++ 
    lastclick = + new Date() 
    console.log(clicks) 
    } 
}) 

적어도 100ms로 seperation에 두 번째 클릭이 허용됩니다 필요가 전에 (같은 시간에 일어나는 클릭을 방지하기 위해 시도 hackish 뭔가를하고 싶어)

+0

두 가지 답변 모두에 감사드립니다. –