Tastatureingabe mit Tastendruck einschränken jquery

Ich habe eine Tastendruckfunktion, die ich mit einem Spiel erstellt habe, um Benutzereingaben in einer Form mit der Eingabetaste vorzunehmen (und um eine Reihe von Funktionen zu haben, die ich zuerst definiert habe, gehen Sie in der Reihenfolge vor, in der die Eingabetaste gedrückt wird).

$(".form-control").keypress(function(event) {
          var keycode = (event.keyCode ? event.keyCode : event.which);
          if (keycode == 13) {
            var space = $(this).val().toLowerCase();

            if (!(wrongGuesses.indexOf(space) > -1 || rightGuesses.indexOf(space) > -1)) {
              play(space);
              $(this).val('');
              endGame();
              return false;
            }
            else
              window.alert("You already guessed this letter.");

            }
  }); 

was funktioniert super. Aber jetzt versuche ich, den Benutzer daran zu hindern, nur Buchstaben und jeweils nur einen Buchstaben gleichzeitig einzugeben. Ich möchte verhindern, dass nur einzelne Buchstaben eingegeben werden, um dann die Verknüpfung meiner Tastendruck-Ereigniskette aufrechtzuerhalten danach auf die Eingabetaste - ich habe versucht, so etwas zu tun:

 $(".form-control").keypress(function(event) {
          var keycode = (event.keyCode ? event.keyCode : event.which);
          if (!(keycode >= 65 && keycode <= 90)){
             event.preventDefault();
          }   
          if (keycode == 13) {
      //    if (keycode > 65 && keycode < 90){
            var space = $(this).val().toLowerCase();

            if (!(wrongGuesses.indexOf(space) > -1 || rightGuesses.indexOf(space) > -1)) {
              play(space);
              $(this).val('');
              endGame();
              return false;
            }
            else
              window.alert("You already guessed this letter.");

            }
         //   }
  });

, das nicht funktioniert (ich glaube, die Syntax ist falsch) und die Funktionalität meines Spiels durcheinander bringt; dann habe ich versucht:

$(".form-control").keypress(function(event) {
          var keycode = (event.keyCode ? event.keyCode : event.which);

          if (keycode == 13) {
            var space = $(this).val().toLowerCase();

            if (!(wrongGuesses.indexOf(space) > -1 || rightGuesses.indexOf(space) > -1)) {
              play(space);
              $(this).val('');
              endGame();
              return false;
            }
            else if (keycode < 13 || keycode > 13 && keycode < 65 || keycode > 90){
              event.preventDefault();
            }
            else
              window.alert("You already guessed this letter.");

            }
  });

which hat auch nicht funktioniert. Ich habe auch versucht, eine andere Funktion zu erstellen, die sich nur mit der Beschränkung der Eingaben auf Buchstaben befasst, die von der Funktion für die Eingabetaste, die mit dem Spiel verbunden ist, getrennt sind. Dies hat ebenfalls nicht funktioniert / dazu geführt, dass die Eingabetaste diese Ereignisse nicht auslöst (oder mein Spiel wird nicht angezeigt) Buchstaben oder richtige Vermutungen als falsche Vermutungen registrieren) sowie nur eine bedingte Aussage machen, ob (Schlüsselcode> 65 || Schlüsselcode <90), die auch Spiel- oder Anzeigefehler verursachte, und ich bin mir nicht sicher, wie ich dabei vorgehen soll. Ich habe den ganzen Tag so viele verschiedene Ansätze ohne Erfolg ausprobiert und einige Ratschläge / Vorschläge wären wirklich dankbar. Hier ist ein Link zu meiner Geige, wenn du sehen willst, wie das ganze Spiel funktioniert:https: //jsfiddle.net/KindeR99/wuftst3t

EDIT **: Ich habe das .alpha () -JQuery-Plugin ausprobiert (obwohl ich eine native JS / JQuery-Lösung dafür finden möchte), die auch bei mir nicht funktioniert hat (aber möglicherweise nicht verwendet wurde) es richtig). Ich bin mir nicht sicher, warum keine dieser Lösungen funktioniert / die Eingabe nicht einschränkt oder meine Spielfunktionalität durcheinander bringt. Ich habe auch versucht, diesen Ansatz w / reg Ausdrücke:

 $(".form-control").keypress(function(event) {
          var keycode = (event.keyCode ? event.keyCode : event.which);
          if (keycode == 13) {
            var space = $(this).val().toLowerCase();

            if (!(wrongGuesses.indexOf(space) > -1 || rightGuesses.indexOf(space) > -1) || space.length !== 1 || !space.match(/[a-z]/)) 
            {
              play(space);
              $(this).val('');
              endGame();
              return false;
            }
            else
              window.alert("That's restricted.");

            }
  });

Und dies, um nur den Schlüsselcode der Eingabe einzuschränken:

$(".form-control").keypress(function(event) {
          var keycode = (event.keyCode ? event.keyCode : event.which);
          if (keycode > 65 || keycode < 90) {
            var space = $(this).val().toLowerCase();

            if (!(wrongGuesses.indexOf(space) > -1 || rightGuesses.indexOf(space) > -1)) {
              play(space);
              $(this).val('');
              endGame();
              return false;
            }
            else
              window.alert("You already guessed this letter.");

            } 
          else 
          {
          event.preventDefault();
          }  
  });

Aber beide haben die HTML-Anzeige meines Spiels oder meiner Spielfunktion durcheinander gebracht (und ich bin mir nicht sicher, welcher Ansatz zur Lösung dieses Problems am besten geeignet ist und welche den geringsten Einfluss auf die Funktionalität meines Spiels hat). Es ist nicht so wichtig, dass die Eingabe erst nach dem Drücken der Eingabetaste erfolgt. Ich möchte nur die Spielefunktionalität wie sie ist beibehalten und bin mir nicht sicher, welchen Weg ich einschlagen soll, um dies zu lösen. Wenn ich wüsste, welcher Ansatz der beste ist Um dies richtig zu machen, könnte ich mich nur auf diese Methode konzentrieren und versuchen, ein ausführlicheres Debugging durchzuführen. Vielen Dank

Antworten auf die Frage(4)

Ihre Antwort auf die Frage