133 Stimmen

Prüfen, ob eine Taste gedrückt ist?

Gibt es eine Möglichkeit, in JavaScript zu erkennen, ob eine Taste gerade gedrückt ist?

Ich kenne das Ereignis "keydown", aber das ist nicht das, was ich brauche. Einige Zeit NACH dem Drücken der Taste, möchte ich in der Lage sein, zu erkennen, ob es noch gedrückt wird.

P. S. Das größte Problem scheint zu sein, dass nach einer gewissen Zeit die Taste beginnt zu wiederholen, Abfeuern von keydown und keyup Ereignisse wie ein Unhold. Hoffentlich gibt es nur eine einfache isKeyDown(key) Funktion, aber wenn nicht, dann wird dieses Problem zu überwinden / gearbeitet werden müssen, um.

15 Stimmen

Ein häufiges Problem bei den Antworten, die ich hier sehe, ist, dass, wenn Sie eine Taste gedrückt halten, dann die Registerkarte wechseln oder den Fokus ändern, die Taste loslassen und dann zurückschalten, der Code glaubt, dass die Taste gedrückt ist, bis Sie sie erneut drücken oder die Maus über die Seite bewegen :-(

0 Stimmen

Ist damit Ihre Frage beantwortet? JavaScript: Prüfen, ob Maustaste gedrückt?

2voto

RobKohr Punkte 6114
/*
Tracks what keys are currently down on the keyboard
*/

function keyboard_module(onUpdate){
    var kb = {};
    var unicode_mapping = {};
    document.onkeydown = function(e){
        var unicode=e.charCode? e.charCode : e.keyCode
        var key = getKey(unicode);
        kb[key] = true;
        if(onUpdate){
            onUpdate(kb);
        }
    }

    document.onkeyup = function(e){
        var unicode=e.charCode? e.charCode : e.keyCode
        var key = getKey(unicode);
        delete kb[key];
        if(onUpdate){
            onUpdate(kb);
        }
    }

    function getKey(unicode){
        if(unicode_mapping[unicode]){
            var key = unicode_mapping[unicode];
        }else{
            var key= unicode_mapping[unicode] = String.fromCharCode(unicode);
        }
        return key;
    }
    return kb;
}

function testing(kb){
    console.log('These are the down keys', kb);
}

var keyboard = keyboard_module(testing);

....
//somewhere else in the code
if(keyboard['K']){/*do something special */}

0 Stimmen

Nicht sicher, ob String.fromCharCode(unicode); ist ein schnelles Lookup oder nicht, deshalb habe ich unicode_mapping Objekt. Dies könnte etwas zu ziehen, um diesen Code ein bisschen zu trimmen, wenn es ultraschnell ist. Da dies wird wiederholt für Key-Downs aufgerufen werden, ist die Geschwindigkeit wichtig, daher habe ich pessimistisch das Mapping hinzugefügt.

2voto

Robert Monfera Punkte 1642

Ich habe die oben genannten Antworten und die vorgeschlagenen keydown / keyup Dieser Ansatz funktioniert nur unter besonderen Umständen. Wenn der Benutzer mit der Alt-Taste weggeht oder eine Tastengeste verwendet, um ein neues Browserfenster oder eine neue Registerkarte zu öffnen, dann wird ein keydown wird registriert, was in Ordnung ist, denn zu diesem Zeitpunkt ist es unmöglich zu sagen, ob die Taste etwas ist, das die Web-App überwacht, oder eine Standard-Browser- oder Betriebssystem-Verknüpfung ist. Wenn Sie zur Browserseite zurückkehren, wird sie immer noch denken, dass die Taste gedrückt ist, obwohl sie in der Zwischenzeit losgelassen wurde. Oder eine Taste wird einfach gedrückt gehalten, während der Benutzer mit der Maus zu einer anderen Registerkarte oder Anwendung wechselt, und dann außerhalb unserer Seite losgelassen.

Modifikatortasten ( Shift usw.) können über mousemove usw., wenn man davon ausgeht, dass beim Zurückblättern mindestens eine Mausinteraktion zu erwarten ist, was häufig der Fall ist.

Für die meisten anderen Tasten (außer Modifikatoren, Tab , Delete aber einschließlich Space , Enter ), Überwachung keypress würde für die meisten Anwendungen funktionieren - eine gedrückte Taste feuert weiter. Es gibt jedoch eine gewisse Latenz beim Zurücksetzen der Taste, aufgrund der Periodizität von keypress feuern. Im Grunde genommen, wenn keypress nicht mehr zündet, kann man die meisten Schlüssel ausschließen. In Kombination mit den Modifikatoren ist das ziemlich sicher, obwohl ich noch nicht untersucht habe, was man mit Tab y Backspace .

Ich bin sicher, es gibt einige Bibliothek gibt, die über diese DOM Schwäche abstrahiert, oder vielleicht einige DOM-Standard-Änderung kümmerte sich um es, da es eine ziemlich alte Frage ist.

0 Stimmen

Tastendruck ist jetzt veraltet. In Chrome scheint es überhaupt nicht zu funktionieren.

1voto

Carl Smotricz Punkte 64366

Andere Leute haben diese Art von Frage schon einmal gestellt (obwohl ich hier im Moment keine offensichtlichen Duplikate sehe).

Ich denke, die Antwort ist, dass die keydown Ereignis (und sein Zwilling keyup ) sind alle Informationen, die Sie erhalten. Die Wiederholung ist ziemlich fest mit dem Betriebssystem verdrahtet, und ein Anwendungsprogramm hat kaum die Möglichkeit, das BIOS nach dem aktuellen Status der Taste zu fragen.

Was Sie tun können, und vielleicht auch müssen, wenn Sie dies zum Laufen bringen wollen, ist, die Taste programmatisch zu entprellen. Im Wesentlichen können Sie Folgendes auswerten keydown y keyup selbst, sondern ignorieren eine keyup Ereignis, wenn es zu schnell nach dem letzten Ereignis stattfindet keydown ... oder Sie sollten Ihre Antwort im Wesentlichen aufschieben keyup lange genug, um sicher zu sein, dass es keine weitere keydown Ereignis, das mit etwa 0,25 Sekunden der keyup .

Dazu müsste man eine Timer-Aktivität verwenden und die Millisekundenzeiten für frühere Ereignisse aufzeichnen. Ich kann nicht sagen, es ist eine sehr ansprechende Lösung, aber...

2 Stimmen

Ich war besorgt, dass es so weit kommen könnte.

1voto

Johnny Punkte 471

Der folgende Code wird von mir verwendet:

var altKeyDownCount = 0;
window.onkeydown = function (e) {
    if (!e) e = window.event;
    if (e.altKey) {
        altKeyDownCount++;
        if (30 < altKeyDownCount) {
            $('.key').removeClass('hidden');
            altKeyDownCount = 0;
        }
        return false;
    }
}

window.onkeyup = function (e) {
    if (!e) e = window.event;
    altKeyDownCount = 0;
    $('.key').addClass('hidden');
}

Wenn der Benutzer die Alt-Taste für einige Zeit (etwa 2 Sekunden) gedrückt hält, erscheint eine Gruppe von Etiketten (class='key hidden'). Wenn die Alt-Taste losgelassen wird, verschwinden die Beschriftungen. jQuery und Bootstrap werden beide verwendet.

0 Stimmen

Und was passiert, wenn "Tab" bei gedrückter Alt-Taste gedrückt wird?

1voto

buildpax Punkte 331

Ich weiß, dies ist sehr alte Frage, jedoch gibt es eine sehr leichtgewichtige (~.5Kb) JavaScript-Bibliothek, die effektiv "Patches" die inkonsistente Auslösung von Tastatur-Ereignis-Handler bei Verwendung der DOM-API.

Die Bibliothek ist Keydrown .

Hier ist das operative Codebeispiel, das für meine Zwecke gut funktioniert hat, indem ich einfach die Taste geändert habe, auf die der Hörer gesetzt werden soll:

kd.P.down(function () {
  console.log('The "P" key is being held down!');
});

kd.P.up(function () {
  console.clear();
});

// This update loop is the heartbeat of Keydrown
kd.run(function () {
  kd.tick();
});

Ich habe Keydrown in mein Client-seitiges JavaScript integriert, um eine ordentliche Pause-Animation in einem Red Light Green Light-Spiel zu erzeugen, das ich gerade schreibe. Sie können das gesamte Spiel ansehen aquí . (Hinweis: Wenn Sie dies in der Zukunft lesen, sollte das Spiel vollständig codiert und spielbar sein :-D!)

Ich hoffe, das hilft.

CodeJaeger.com

CodeJaeger ist eine Gemeinschaft für Programmierer, die täglich Hilfe erhalten..
Wir haben viele Inhalte, und Sie können auch Ihre eigenen Fragen stellen oder die Fragen anderer Leute lösen.

Powered by:

X