Comment puis-je obtenir des événements de répétition automatique dans Firefox lorsque les touches fléchées sont enfoncées?

Question

J'ai plusieurs éditables div s. Je veux sauter à travers eux en appuyant sur les touches fléchées (38 et 40). Firefox 3 sur Mac OS et Linux ne répètera pas les événements en maintenant la touche enfoncée. Évidemment, seuls les événements keypress sont pris en charge pour la répétition. Comme les touches 38 et 40 ne sont prises en charge que sur keydown, je suis coincé.

Answer 1

Vous pouvez utiliser keypress et vérifiez la e.keyCode == 38,40 au lieu de e.which ou e.charCode Ceci est cohérent entre Mac et Win.

$('#test').bind($.browser.mozilla ? 'keypress' : 'keyup', function(e) { 
    if ((e.which || e.keyCode) == 40) { /* doSometing() */ } 
}); 

Voir JavaScript Madness: Keyboard Events (3.2. Les valeurs retournées sur les événements de caractères) et event.keyCode sur MDC.

Answer 2

Oui, vous êtes coincé. Vous pouvez émuler le comportement souhaité en utilisant des minuteurs jusqu'à ce que vous receviez le keyup correspondant, mais cela n'utilisera évidemment pas les paramètres de répétition du clavier de l'ordinateur de l'utilisateur.

Le code suivant utilise la méthode ci-dessus. Le code que vous voulez gérer les événements keydown (réels et simulés) devrait aller handleKeyDown:

var keyDownTimers = {}; 
var keyIsDown = {}; 
var firstKeyRepeatDelay = 1000; 
var keyRepeatInterval = 100; 

function handleKeyDown(keyCode) { 
    if (keyCode == 38) { 
     alert("Up"); 
    } 
} 

function simpleKeyDown(evt) { 
    evt = evt || window.event; 
    var keyCode = evt.keyCode; 
    handleKeyDown(keyCode); 
} 

document.onkeydown = function(evt) { 
    var timer, fireKeyDown; 
    evt = evt || window.event; 
    var keyCode = evt.keyCode; 

    if (keyIsDown[keyCode]) { 
     // Key is already down, so repeating key events are supported by the browser 
     timer = keyDownTimers[keyCode]; 
     if (timer) { 
      window.clearTimeout(timer); 
     } 

     keyIsDown[keyCode] = true; 
     handleKeyDown(keyCode); 

     // No need for the complicated stuff, so remove it 
     document.onkeydown = simpleKeyDown; 
     document.onkeyup = null; 
    } else { 
     // Key is not down, so set up timer 
     fireKeyDown = function() { 
      // Set up next keydown timer 
      keyDownTimers[keyCode] = window.setTimeout(fireKeyDown, keyRepeatInterval); 
      handleKeyDown(keyCode); 
     }; 

     keyDownTimers[keyCode] = window.setTimeout(fireKeyDown, firstKeyRepeatDelay); 
     keyIsDown[keyCode] = true; 
    } 
}; 

document.onkeyup = function(evt) { 
    evt = evt || window.event; 
    var keyCode = evt.keyCode; 
    var timer = keyDownTimers[keyCode]; 
    if (timer) { 
     window.clearTimeout(timer); 
    } 
    keyIsDown[keyCode] = false; 
};