JS - Deaktivieren Sie den Eventlistener, sobald das Eingabefeld ausgewählt ist

Ich füge gerade einen EventListener zu meinem Dokument hinzu. Welche funktioniert gut mit dem folgenden Code:JS - Deaktivieren Sie den Eventlistener, sobald das Eingabefeld ausgewählt ist

document.addEventListener('keydown', function(event) 
{ 
    if(event.keyCode === 68){ 
     socket.emit('keyPress', {inputId: 'right', state: true}); 
    } 
    else if(event.keyCode === 83){ 
     socket.emit('keyPress', {inputId: 'down', state: true}); 
    } 
    else if(event.keyCode === 65){ 
     socket.emit('keyPress', {inputId: 'left', state: true}); 
    } 
    else if(event.keyCode === 87){ 
     socket.emit('keyPress', {inputId: 'up', state: true}); 
    } 
}); 

document.addEventListener('keyup', function(event) 
{ 
    if(event.keyCode === 68){ 
     socket.emit('keyPress', {inputId: 'right', state: false}); 
    } 
    else if(event.keyCode === 83){ 
     socket.emit('keyPress', {inputId: 'down', state: false}); 
    } 
    else if(event.keyCode === 65){ 
     socket.emit('keyPress', {inputId: 'left', state: false}); 
    } 
    else if(event.keyCode === 87){ 
     socket.emit('keyPress', {inputId: 'up', state: false}); 
    } 
});

Aber sobald ich ein Eingabefeld wählen würde, und geben Sie etwas enthält, W, A, S, D dann würde der Eventlistener ausgelöst werden.

Gibt es eine Möglichkeit, den eventListener zu deaktivieren, sobald das Eingabefeld ausgewählt ist?

Quelle

2017-08-18 stackquestiionx

Wie wäre es mit der Überprüfung für den Fokus innerhalb der keyup/keydown Listeners? Vielleicht fügen Sie eine Klasse wie '.ignoreInput' hinzu, die Sie Elementen hinzufügen können, und prüfen dann, ob das aktuell fokussierte Element diese Klasse mit etwas wie' document.activeElement' hat (vorausgesetzt, die Listener sollen wieder funktionieren, sobald die Eingabe unscharf ist) – DBS

'input.addEventListener ('Fokus', Funktion() {document.removeEventListener ('keydown' ....'? –

Sie müssen Event Bubbling von der Eingabe deaktivieren. Etwas wie folgt aus:

input.addEventListener('keyup', function (e) { 

    e.stopPropagation(); 

}, false); 
input.addEventListener('keydown', function (e) { 

    e.stopPropagation(); 

}, false);

So Code über Sie keyup und keydown Ereignis sprudelnden deaktivieren wird und niemand übergeordneten Knoten des Eingangs nicht hören will diese Ereignisse

Quelle

2017-08-18 14:46:11 MysterX

Ja überprüfen, was event.target ist, wenn es Ihr ist Input-Element einfach eine Rückkehr, wenn nicht, dann lassen Sie den Code weitermachen.

document.addEventListener('keydown', function(event) { 
    if(event.target === someReferenceToYourElement){ 
    return; 
    } 
    //rest of code 
});

Quelle

2017-08-18 14:46:19

Sie könnten einen Ereignis-Listener zum Fokus der Eingabe hinzufügen.

document.getElementsByTagName('input').addEventListener('focus', function(e) { 
    e.StopPropagation(); 
}

Quelle

2017-08-18 14:53:30 matthiasbe

Ich schlage vor, Sie, so etwas zu tun:

$('document').keypress(function(event) { 
    if (event.which == 65) { // A 
     // Do your stuff 
    } 
})

Dieser Code das gleiche wie Ihr ist aber auf der entier DOM.

$('#input').val.indexOf('a')

Dieser Code wird überprüfen, ob Ihr Feld den Buchstaben A enthält, kann die Zeichenfolge ‚ABCD‘ oder ‚bar‘, etc. sein

Wenn Sie überprüfen wollen, wenn das Feld, das Sie den Fokus verlieren können auch Sie die Ereignisunschärfe von jquery https://api.jquery.com/blur/

Quelle

2017-08-18 14:55:43 Erfindel

JS - Deaktivieren Sie den Eventlistener, sobald das Eingabefeld ausgewählt ist

Antwort

Verwandte Themen