0

Ich versuche zu bestimmen, wie lange eine Taste gedrückt wird, wenn Sie tippen.funktioniert nur wenn ich langsam tippe

var keyDownTimer = 0; 
var keyUpTimer = 0; 
var keyPressedCounter = 0; 
var dt; 
var keyDownDisplay = document.getElementById("keyDownTimer"); 
var keyPressedDisplay = document.getElementById("keyPressed"); 
keyDownDisplay.innerHTML = keyDownTimer; 
keyPressedDisplay.innerHTML = keyPressedCounter; 
function keypressed(){ 
keyPressedCounter++; 
    keyPressedDisplay.innerHTML = keyPressedCounter; 
} 
function keydown(){ 
    dt = setInterval(addDownTime, 1); 
} 
function addDownTime(){ 
    keyDownTimer++; 
    keyDownDisplay.innerHTML = keyDownTimer/1000; 
} 
function keyup(){ 
    clearInterval(dt); 
} 

und meine html

<style> 
     div{ 
     height:25px; 
     width:100px; 
     display:inline-block; 
     margin-right:10px; 
     } 
    </style> 
</head> 
<body> 
<div id="keyUpTimer"></div><div id="keyDownTimer"></div><div id="keyPressed"></div> 
<input id="textBox" type="text" onkeyup="keyup()" onkeydown="keydown()" onkeypress="keypressed()"> 

als ich in das Textfeld tippe, funktioniert alles richtig, aber dann aus irgendeinem Grund beginnt der keyDownTimer nur:

hier mein Javascript ist run, als würde keydown() nicht laufen. Ich weiß, dass mein Code ein wenig schwer zu lesen ist, aber ich bin mir ziemlich sicher, dass es korrekt ist. und dass es richtig laufen sollte. Langsames Tippen scheint dem Problem ein wenig zu helfen, aber es endet immer noch mit der Unendlichkeit. Jede Hilfe wäre willkommen. und wenn Sie erklären könnten, warum es tut, was es tut, wäre das großartig.

+0

Was passiert, wenn Sie drücken (und halten) A, dann B drücken, dann beide loslassen? Das passiert oft beim Tippen schnell ... (Denken Sie darüber nach, was in diesem Fall mit 'dt' geschieht!) – psmears

Antwort

0

Sie ersetzen Ihre dt-Variable, die viele Intervalle referenziert.

Das Problem ist, wenn Sie mehrere Tasten gleichzeitig drücken, die erste Taste down dt ist durch die zweite und so weiter ersetzt.

Try this:

var dt = 0; 
... 
function keydown(){ 
    if(dt == 0){ 
    dt = setInterval(addDownTime, 1); 
    } 
} 
function addDownTime(){ 
    keyDownTimer++; 
    keyDownDisplay.innerHTML = keyDownTimer/1000; 
} 
function keyup(){ 
    clearInterval(dt); 
    dt = 0; 
} 
Verwandte Themen