Wie kann man herausfinden, welche Zeichentaste gedrückt wurde?

Question

Ich möchte gerne herausfinden, welche Zeichentaste auf eine browserübergreifende Weise in reinem Javascript gedrückt wird.

Answer 1

JavaScript "Löschen":

function myKeyPress(e){
  var keynum;

  if(window.event) { // IE                  
    keynum = e.keyCode;
  } else if(e.which){ // Netscape/Firefox/Opera                 
    keynum = e.which;
  }

  alert(String.fromCharCode(keynum));
}

<input type="text" onkeypress="return myKeyPress(event)" />

JQuery:

$("input").keypress(function(event){
  alert(String.fromCharCode(event.which)); 
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input/>

Answer 2

Neuer und viel sauberer: Verwendung event.key . Keine willkürlichen Zahlencodes mehr!

HINWEIS: Die alten Eigenschaften ( .keyCode y .which ) sind veraltet.

node.addEventListener('keydown', function(event) {
    const key = event.key; // "a", "1", "Shift", etc.
});

Wenn Sie sicherstellen wollen, dass nur einzelne Zeichen eingegeben werden, markieren Sie key.length === 1 oder dass es sich um eines der Zeichen handelt, die Sie erwarten.

Mozilla-Dokumente

Unterstützte Browser

Answer 3

Es gibt eine Million Duplikate dieser Frage hier, aber ich versuche es trotzdem noch einmal:

document.onkeypress = function(evt) {
    evt = evt || window.event;
    var charCode = evt.keyCode || evt.which;
    var charStr = String.fromCharCode(charCode);
    alert(charStr);
};

Die beste Referenz für Schlüsselereignisse, die ich kenne, ist http://unixpapa.com/js/key.html .

Answer 4

Versuchen Sie es:

<table>
  <tr>
    <td>Key:</td>
    <td id="key"></td>
  </tr>
  <tr>
    <td>Key Code:</td>
    <td id="keyCode"></td>
  </tr>
  <tr>
    <td>Event Code:</td>
    <td id="eventCode"></td>
  </tr>
</table>
<script type="text/javascript">
  window.addEventListener("keydown", function(e) {
    //tested in IE/Chrome/Firefox
    document.getElementById("key").innerHTML = e.key;
    document.getElementById("keyCode").innerHTML = e.keyCode;
    document.getElementById("eventCode").innerHTML = e.code;
  })
</script>

*Hinweis: dies funktioniert in "Code-Schnipsel ausführen".

Diese Website tut dasselbe wie mein obiger Code: Schlüsselcode.info

Answer 5

Verwenden Sie diese:

function onKeyPress(evt){
  evt = (evt) ? evt : (window.event) ? event : null;
  if (evt)
  {
    var charCode = (evt.charCode) ? evt.charCode :((evt.keyCode) ? evt.keyCode :((evt.which) ? evt.which : 0));
    if (charCode == 13) 
        alert('User pressed Enter');
  }
}