Inilah yang saya miliki sekarang:

$("input").bind("keydown",function(e){
    var value = this.value + String.fromCharCode(e.keyCode);
}

Jika e.keyCodetidak mungkin karakter ASCII ( Alt, backspace, del, arrows., Dll) ... Saya akan sekarang perlu untuk trimnilai-nilai ini dari valueentah bagaimana (sebaiknya pemrograman - tidak dengan tabel lookup).

Saya menggunakan jQuery.

Saya harus menggunakan keydownacara tersebut. keyPresstidak mengaktifkan untuk kunci tertentu saya harus capture ( Esc, del, backspace, dll).

Saya tidak bisa menggunakan setTimeoutuntuk mendapatkan nilai input. setTimeout(function(){},0)terlalu lambat.

Mungkin saya tidak mengerti pertanyaan dengan benar, tetapi tidak bisakah Anda menggunakan keyupjika Anda ingin menangkap kedua input?

$("input").bind("keyup",function(e){
    var value = this.value + String.fromCharCode(e.keyCode);
});

Dalam pengalaman saya String.fromCharCode(e.keyCode)tidak bisa diandalkan. String.fromCharCodemengharapkan kode kode unicode sebagai argumen; e.keyCodemengembalikan kode kunci javascript. Kode kunci Javascript dan kode unicode bukan hal yang sama! Secara khusus, tombol-tombol angka mengembalikan berbeda keycodedari tombol-tombol angka biasa (karena mereka adalah kunci yang berbeda) sementara yang sama keycodedikembalikan untuk keduanya upperdan lowercasehuruf (Anda menekan tombol yang sama dalam kedua kasus), meskipun mereka memiliki berbeda charcodes.

Misalnya, tombol angka 1 biasa menghasilkan suatu peristiwa dengan keycode49 sementara tombol angka 1 (dengan Numlockon) menghasilkan keycode97. Digunakan dengan String.fromCharCodekita mendapatkan yang berikut:

String.fromCharCode(49) returns "1"
String.fromCharCode(97) returns "a"

String.fromCharCodemengharapkan kode sandi unicode, bukan kode kunci javascript. Kunci tersebut amenghasilkan suatu peristiwa dengan keycode65, independen dari kasus karakter yang akan dihasilkan (ada juga pengubah untuk jika Shifttombol ditekan, dll. Dalam acara tersebut). Karakter amemiliki charcodekode unicode 61 sedangkan karakter Amemiliki kode charcode41 (sesuai dengan, misalnya, http://www.utf8-chartable.de/ ). Namun, itu adalah hexnilai, yang dikonversi ke desimal memberi kita nilai charcode65 untuk "A" dan 97 untuk "a". [1] Ini konsisten dengan apa yang kami dapatkan dari String.fromCharCodenilai-nilai ini.

Persyaratan saya sendiri terbatas pada pemrosesan angka dan huruf biasa (menerima atau menolak tergantung pada posisi dalam string) dan membiarkan karakter kontrol ( F-keys, -something Ctrl) melalui. Dengan demikian saya dapat memeriksa karakter kontrol, jika itu bukan karakter kontrol saya memeriksa terhadap suatu rentang dan hanya kemudian saya perlu mendapatkan karakter yang sebenarnya. Mengingat saya tidak khawatir tentang kasus (saya mengubah semua huruf menjadi huruf besar) dan telah membatasi jangkauan kode kunci, saya hanya perlu khawatir tentang tombol angka pad. Berikut ini cukup untuk itu:

String.fromCharCode((96 <= key && key <= 105)? key-48 : key)

Secara umum, fungsi untuk mengembalikan karakter dari andal charcodeakan sangat bagus (mungkin sebagai plugin jQuery), tapi saya tidak punya waktu untuk menulisnya sekarang. Maaf.

Saya juga menyebutkan e.which(jika Anda menggunakan jQuery) yang menjadi normal e.keyCodedan e.charCode, sehingga Anda tidak perlu khawatir tentang jenis tombol apa yang ditekan. Masalah dengan menggabungkannya dengan String.fromCharCodesisa - sisa.

[1] Saya bingung sebentar -. semua dokumen mengatakan bahwa String.fromCharCodemengharapkan unicode charcode, sementara dalam praktiknya tampaknya berfungsi untuk kode karakter ASCII, tapi itu saya pikir karena kebutuhan untuk mengkonversi ke desimal dari hex, dikombinasikan dengan fakta bahwa kode ASCII dan kode unimal decode tumpang tindih untuk biasa huruf latin.

Nama kunci yang dapat dibaca yang diindeks oleh kode kunci

Ada kode kunci yang relatif sedikit jadi saya hanya mendaftar semua nilai yang sesuai dalam array statis sehingga saya bisa dengan mudah mengkonversi angka 65menjadi AmenggunakankeyboardMap[65]

Tidak semua kode kunci memetakan ke karakter yang dapat dicetak sehingga beberapa string yang dapat diidentifikasi lainnya dikembalikan.

Anda mungkin perlu memodifikasi array yang sesuai dengan kebutuhan Anda dan cukup mengembalikan string kosong untuk semua karakter yang tidak ingin Anda terjemahkan. Array berikut memungkinkan saya untuk dengan cepat dan andal menentukan tombol mana yang ditekan di lingkungan apa pun. Nikmati!

// names of known key codes (0-255)

var keyboardMap = [
  "", // [0]
  "", // [1]
  "", // [2]
  "CANCEL", // [3]
  "", // [4]
  "", // [5]
  "HELP", // [6]
  "", // [7]
  "BACK_SPACE", // [8]
  "TAB", // [9]
  "", // [10]
  "", // [11]
  "CLEAR", // [12]
  "ENTER", // [13]
  "ENTER_SPECIAL", // [14]
  "", // [15]
  "SHIFT", // [16]
  "CONTROL", // [17]
  "ALT", // [18]
  "PAUSE", // [19]
  "CAPS_LOCK", // [20]
  "KANA", // [21]
  "EISU", // [22]
  "JUNJA", // [23]
  "FINAL", // [24]
  "HANJA", // [25]
  "", // [26]
  "ESCAPE", // [27]
  "CONVERT", // [28]
  "NONCONVERT", // [29]
  "ACCEPT", // [30]
  "MODECHANGE", // [31]
  "SPACE", // [32]
  "PAGE_UP", // [33]
  "PAGE_DOWN", // [34]
  "END", // [35]
  "HOME", // [36]
  "LEFT", // [37]
  "UP", // [38]
  "RIGHT", // [39]
  "DOWN", // [40]
  "SELECT", // [41]
  "PRINT", // [42]
  "EXECUTE", // [43]
  "PRINTSCREEN", // [44]
  "INSERT", // [45]
  "DELETE", // [46]
  "", // [47]
  "0", // [48]
  "1", // [49]
  "2", // [50]
  "3", // [51]
  "4", // [52]
  "5", // [53]
  "6", // [54]
  "7", // [55]
  "8", // [56]
  "9", // [57]
  "COLON", // [58]
  "SEMICOLON", // [59]
  "LESS_THAN", // [60]
  "EQUALS", // [61]
  "GREATER_THAN", // [62]
  "QUESTION_MARK", // [63]
  "AT", // [64]
  "A", // [65]
  "B", // [66]
  "C", // [67]
  "D", // [68]
  "E", // [69]
  "F", // [70]
  "G", // [71]
  "H", // [72]
  "I", // [73]
  "J", // [74]
  "K", // [75]
  "L", // [76]
  "M", // [77]
  "N", // [78]
  "O", // [79]
  "P", // [80]
  "Q", // [81]
  "R", // [82]
  "S", // [83]
  "T", // [84]
  "U", // [85]
  "V", // [86]
  "W", // [87]
  "X", // [88]
  "Y", // [89]
  "Z", // [90]
  "OS_KEY", // [91] Windows Key (Windows) or Command Key (Mac)
  "", // [92]
  "CONTEXT_MENU", // [93]
  "", // [94]
  "SLEEP", // [95]
  "NUMPAD0", // [96]
  "NUMPAD1", // [97]
  "NUMPAD2", // [98]
  "NUMPAD3", // [99]
  "NUMPAD4", // [100]
  "NUMPAD5", // [101]
  "NUMPAD6", // [102]
  "NUMPAD7", // [103]
  "NUMPAD8", // [104]
  "NUMPAD9", // [105]
  "MULTIPLY", // [106]
  "ADD", // [107]
  "SEPARATOR", // [108]
  "SUBTRACT", // [109]
  "DECIMAL", // [110]
  "DIVIDE", // [111]
  "F1", // [112]
  "F2", // [113]
  "F3", // [114]
  "F4", // [115]
  "F5", // [116]
  "F6", // [117]
  "F7", // [118]
  "F8", // [119]
  "F9", // [120]
  "F10", // [121]
  "F11", // [122]
  "F12", // [123]
  "F13", // [124]
  "F14", // [125]
  "F15", // [126]
  "F16", // [127]
  "F17", // [128]
  "F18", // [129]
  "F19", // [130]
  "F20", // [131]
  "F21", // [132]
  "F22", // [133]
  "F23", // [134]
  "F24", // [135]
  "", // [136]
  "", // [137]
  "", // [138]
  "", // [139]
  "", // [140]
  "", // [141]
  "", // [142]
  "", // [143]
  "NUM_LOCK", // [144]
  "SCROLL_LOCK", // [145]
  "WIN_OEM_FJ_JISHO", // [146]
  "WIN_OEM_FJ_MASSHOU", // [147]
  "WIN_OEM_FJ_TOUROKU", // [148]
  "WIN_OEM_FJ_LOYA", // [149]
  "WIN_OEM_FJ_ROYA", // [150]
  "", // [151]
  "", // [152]
  "", // [153]
  "", // [154]
  "", // [155]
  "", // [156]
  "", // [157]
  "", // [158]
  "", // [159]
  "CIRCUMFLEX", // [160]
  "EXCLAMATION", // [161]
  "DOUBLE_QUOTE", // [162]
  "HASH", // [163]
  "DOLLAR", // [164]
  "PERCENT", // [165]
  "AMPERSAND", // [166]
  "UNDERSCORE", // [167]
  "OPEN_PAREN", // [168]
  "CLOSE_PAREN", // [169]
  "ASTERISK", // [170]
  "PLUS", // [171]
  "PIPE", // [172]
  "HYPHEN_MINUS", // [173]
  "OPEN_CURLY_BRACKET", // [174]
  "CLOSE_CURLY_BRACKET", // [175]
  "TILDE", // [176]
  "", // [177]
  "", // [178]
  "", // [179]
  "", // [180]
  "VOLUME_MUTE", // [181]
  "VOLUME_DOWN", // [182]
  "VOLUME_UP", // [183]
  "", // [184]
  "", // [185]
  "SEMICOLON", // [186]
  "EQUALS", // [187]
  "COMMA", // [188]
  "MINUS", // [189]
  "PERIOD", // [190]
  "SLASH", // [191]
  "BACK_QUOTE", // [192]
  "", // [193]
  "", // [194]
  "", // [195]
  "", // [196]
  "", // [197]
  "", // [198]
  "", // [199]
  "", // [200]
  "", // [201]
  "", // [202]
  "", // [203]
  "", // [204]
  "", // [205]
  "", // [206]
  "", // [207]
  "", // [208]
  "", // [209]
  "", // [210]
  "", // [211]
  "", // [212]
  "", // [213]
  "", // [214]
  "", // [215]
  "", // [216]
  "", // [217]
  "", // [218]
  "OPEN_BRACKET", // [219]
  "BACK_SLASH", // [220]
  "CLOSE_BRACKET", // [221]
  "QUOTE", // [222]
  "", // [223]
  "META", // [224]
  "ALTGR", // [225]
  "", // [226]
  "WIN_ICO_HELP", // [227]
  "WIN_ICO_00", // [228]
  "", // [229]
  "WIN_ICO_CLEAR", // [230]
  "", // [231]
  "", // [232]
  "WIN_OEM_RESET", // [233]
  "WIN_OEM_JUMP", // [234]
  "WIN_OEM_PA1", // [235]
  "WIN_OEM_PA2", // [236]
  "WIN_OEM_PA3", // [237]
  "WIN_OEM_WSCTRL", // [238]
  "WIN_OEM_CUSEL", // [239]
  "WIN_OEM_ATTN", // [240]
  "WIN_OEM_FINISH", // [241]
  "WIN_OEM_COPY", // [242]
  "WIN_OEM_AUTO", // [243]
  "WIN_OEM_ENLW", // [244]
  "WIN_OEM_BACKTAB", // [245]
  "ATTN", // [246]
  "CRSEL", // [247]
  "EXSEL", // [248]
  "EREOF", // [249]
  "PLAY", // [250]
  "ZOOM", // [251]
  "", // [252]
  "PA1", // [253]
  "WIN_OEM_CLEAR", // [254]
  "" // [255]
];

Catatan: Posisi setiap nilai dalam array di atas adalah penting. The ""adalah penampung untuk kode dengan nilai-nilai yang tidak diketahui.

Coba cuplikan kode berikut menggunakan pendekatan pencarian array statis ini ...

var keyCodes = [];

$("#reset").click(function() {
  keyCodes = [];
  $("#in").val("");
  $("#key-codes").html("var keyCodes = [ ];");
  $("#key-names").html("var keyNames = [ ];");
});

$(document).keydown(function(e) {
  keyCodes.push(e.which);
  updateOutput();
});

function updateOutput() {
  var kC = "var keyCodes = [ ";
  var kN = "var keyNames = [ ";

  var len = keyCodes.length;

  for (var i = 0; i < len; i++) {
    kC += keyCodes[i];
    kN += "'"+keyboardMap[keyCodes[i]]+"'";
    if (i !== (len - 1)) {
      kC += ", ";
      kN += ", ";
    }
  }

  kC += " ];";
  kN += " ];";

  $("#key-codes").html(kC);
  $("#key-names").html(kN);
}



var keyboardMap = [
  "", // [0]
  "", // [1]
  "", // [2]
  "CANCEL", // [3]
  "", // [4]
  "", // [5]
  "HELP", // [6]
  "", // [7]
  "BACK_SPACE", // [8]
  "TAB", // [9]
  "", // [10]
  "", // [11]
  "CLEAR", // [12]
  "ENTER", // [13]
  "ENTER_SPECIAL", // [14]
  "", // [15]
  "SHIFT", // [16]
  "CONTROL", // [17]
  "ALT", // [18]
  "PAUSE", // [19]
  "CAPS_LOCK", // [20]
  "KANA", // [21]
  "EISU", // [22]
  "JUNJA", // [23]
  "FINAL", // [24]
  "HANJA", // [25]
  "", // [26]
  "ESCAPE", // [27]
  "CONVERT", // [28]
  "NONCONVERT", // [29]
  "ACCEPT", // [30]
  "MODECHANGE", // [31]
  "SPACE", // [32]
  "PAGE_UP", // [33]
  "PAGE_DOWN", // [34]
  "END", // [35]
  "HOME", // [36]
  "LEFT", // [37]
  "UP", // [38]
  "RIGHT", // [39]
  "DOWN", // [40]
  "SELECT", // [41]
  "PRINT", // [42]
  "EXECUTE", // [43]
  "PRINTSCREEN", // [44]
  "INSERT", // [45]
  "DELETE", // [46]
  "", // [47]
  "0", // [48]
  "1", // [49]
  "2", // [50]
  "3", // [51]
  "4", // [52]
  "5", // [53]
  "6", // [54]
  "7", // [55]
  "8", // [56]
  "9", // [57]
  "COLON", // [58]
  "SEMICOLON", // [59]
  "LESS_THAN", // [60]
  "EQUALS", // [61]
  "GREATER_THAN", // [62]
  "QUESTION_MARK", // [63]
  "AT", // [64]
  "A", // [65]
  "B", // [66]
  "C", // [67]
  "D", // [68]
  "E", // [69]
  "F", // [70]
  "G", // [71]
  "H", // [72]
  "I", // [73]
  "J", // [74]
  "K", // [75]
  "L", // [76]
  "M", // [77]
  "N", // [78]
  "O", // [79]
  "P", // [80]
  "Q", // [81]
  "R", // [82]
  "S", // [83]
  "T", // [84]
  "U", // [85]
  "V", // [86]
  "W", // [87]
  "X", // [88]
  "Y", // [89]
  "Z", // [90]
  "OS_KEY", // [91] Windows Key (Windows) or Command Key (Mac)
  "", // [92]
  "CONTEXT_MENU", // [93]
  "", // [94]
  "SLEEP", // [95]
  "NUMPAD0", // [96]
  "NUMPAD1", // [97]
  "NUMPAD2", // [98]
  "NUMPAD3", // [99]
  "NUMPAD4", // [100]
  "NUMPAD5", // [101]
  "NUMPAD6", // [102]
  "NUMPAD7", // [103]
  "NUMPAD8", // [104]
  "NUMPAD9", // [105]
  "MULTIPLY", // [106]
  "ADD", // [107]
  "SEPARATOR", // [108]
  "SUBTRACT", // [109]
  "DECIMAL", // [110]
  "DIVIDE", // [111]
  "F1", // [112]
  "F2", // [113]
  "F3", // [114]
  "F4", // [115]
  "F5", // [116]
  "F6", // [117]
  "F7", // [118]
  "F8", // [119]
  "F9", // [120]
  "F10", // [121]
  "F11", // [122]
  "F12", // [123]
  "F13", // [124]
  "F14", // [125]
  "F15", // [126]
  "F16", // [127]
  "F17", // [128]
  "F18", // [129]
  "F19", // [130]
  "F20", // [131]
  "F21", // [132]
  "F22", // [133]
  "F23", // [134]
  "F24", // [135]
  "", // [136]
  "", // [137]
  "", // [138]
  "", // [139]
  "", // [140]
  "", // [141]
  "", // [142]
  "", // [143]
  "NUM_LOCK", // [144]
  "SCROLL_LOCK", // [145]
  "WIN_OEM_FJ_JISHO", // [146]
  "WIN_OEM_FJ_MASSHOU", // [147]
  "WIN_OEM_FJ_TOUROKU", // [148]
  "WIN_OEM_FJ_LOYA", // [149]
  "WIN_OEM_FJ_ROYA", // [150]
  "", // [151]
  "", // [152]
  "", // [153]
  "", // [154]
  "", // [155]
  "", // [156]
  "", // [157]
  "", // [158]
  "", // [159]
  "CIRCUMFLEX", // [160]
  "EXCLAMATION", // [161]
  "DOUBLE_QUOTE", // [162]
  "HASH", // [163]
  "DOLLAR", // [164]
  "PERCENT", // [165]
  "AMPERSAND", // [166]
  "UNDERSCORE", // [167]
  "OPEN_PAREN", // [168]
  "CLOSE_PAREN", // [169]
  "ASTERISK", // [170]
  "PLUS", // [171]
  "PIPE", // [172]
  "HYPHEN_MINUS", // [173]
  "OPEN_CURLY_BRACKET", // [174]
  "CLOSE_CURLY_BRACKET", // [175]
  "TILDE", // [176]
  "", // [177]
  "", // [178]
  "", // [179]
  "", // [180]
  "VOLUME_MUTE", // [181]
  "VOLUME_DOWN", // [182]
  "VOLUME_UP", // [183]
  "", // [184]
  "", // [185]
  "SEMICOLON", // [186]
  "EQUALS", // [187]
  "COMMA", // [188]
  "MINUS", // [189]
  "PERIOD", // [190]
  "SLASH", // [191]
  "BACK_QUOTE", // [192]
  "", // [193]
  "", // [194]
  "", // [195]
  "", // [196]
  "", // [197]
  "", // [198]
  "", // [199]
  "", // [200]
  "", // [201]
  "", // [202]
  "", // [203]
  "", // [204]
  "", // [205]
  "", // [206]
  "", // [207]
  "", // [208]
  "", // [209]
  "", // [210]
  "", // [211]
  "", // [212]
  "", // [213]
  "", // [214]
  "", // [215]
  "", // [216]
  "", // [217]
  "", // [218]
  "OPEN_BRACKET", // [219]
  "BACK_SLASH", // [220]
  "CLOSE_BRACKET", // [221]
  "QUOTE", // [222]
  "", // [223]
  "META", // [224]
  "ALTGR", // [225]
  "", // [226]
  "WIN_ICO_HELP", // [227]
  "WIN_ICO_00", // [228]
  "", // [229]
  "WIN_ICO_CLEAR", // [230]
  "", // [231]
  "", // [232]
  "WIN_OEM_RESET", // [233]
  "WIN_OEM_JUMP", // [234]
  "WIN_OEM_PA1", // [235]
  "WIN_OEM_PA2", // [236]
  "WIN_OEM_PA3", // [237]
  "WIN_OEM_WSCTRL", // [238]
  "WIN_OEM_CUSEL", // [239]
  "WIN_OEM_ATTN", // [240]
  "WIN_OEM_FINISH", // [241]
  "WIN_OEM_COPY", // [242]
  "WIN_OEM_AUTO", // [243]
  "WIN_OEM_ENLW", // [244]
  "WIN_OEM_BACKTAB", // [245]
  "ATTN", // [246]
  "CRSEL", // [247]
  "EXSEL", // [248]
  "EREOF", // [249]
  "PLAY", // [250]
  "ZOOM", // [251]
  "", // [252]
  "PA1", // [253]
  "WIN_OEM_CLEAR", // [254]
  "" // [255]
];

#key-codes,
#key-names {
  font-family: courier, serif;
  font-size: 1.2em;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input id="in" placeholder="Type here..." />
<button id="reset">Reset</button>
<br/>
<br/>
<div id="key-codes">var keyCodes = [ ];</div>
<div id="key-names">var keyNames = [ ];</div>

Kode kunci yang perlu diperhatikan

Surat AZ: (65-90)

keyboardMap[65];  // A
...
keyboardMap[90];  // Z

Digit 0-9: (48-57)

keyboardMap[48];  // 0
...
keyboardMap[57];  // 9

Angka Pad 0-9: (96-105)

keyboardMap[96];   // NUMPAD0
...
keyboardMap[105];  // NUMPAD9

Tombol Panah: (37-40)

keyboardMap[37];  // LEFT
keyboardMap[38];  // UP
keyboardMap[39];  // RIGHT
keyboardMap[40];  // DOWN

Kunci Tab: (9)

keyboardMap[9];  // TAB

Enter Key: (13)

keyboardMap[13];  // ENTER

Kunci bilah spasi: (32)

keyboardMap[32];  // SPACE

OS Specific Key (91) Windows Key (Windows) atau Command Key (Mac)

keyboardMap[91];  // OS_KEY

Tombol Alt: (18)

keyboardMap[18];  // ALT

Kunci Kontrol: (17)

keyboardMap[17];  // CONTROL

Tombol Shift: (16)

keyboardMap[16];  // SHIFT

Caps Lock Key: (20)

keyboardMap[20];  // CAPS_LOCK

Hanya sebuah catatan penting: jawaban yang diterima di atas tidak akan berfungsi dengan benar untuk keyCode> = 144, yaitu titik, koma, tanda hubung, dll. Bagi mereka Anda harus menggunakan algoritma yang lebih umum:

let chrCode = keyCode - 48 * Math.floor(keyCode / 48);
let chr = String.fromCharCode((96 <= keyCode) ? chrCode: keyCode);

Jika Anda penasaran mengapa, ini tampaknya perlu karena perilaku fungsi JS bawaan String.fromCharCode(). Untuk nilai-nilai keyCode <= 96itu tampaknya memetakan menggunakan fungsi:

chrCode = keyCode - 48 * Math.floor(keyCode / 48)

Untuk nilai-nilai keyCode > 96itu tampaknya memetakan menggunakan fungsi:

chrCode = keyCode

Jika ini kelihatan seperti perilaku aneh maka saya setuju. Sedihnya, itu akan sangat jauh dari hal paling aneh yang pernah saya lihat di inti JS.

document.onkeydown = function(e) {
    let keyCode = e.keyCode;
    let chrCode = keyCode - 48 * Math.floor(keyCode / 48);
    let chr = String.fromCharCode((96 <= keyCode) ? chrCode: keyCode);
    console.log(chr);
};

<input type="text" placeholder="Focus and Type"/>

Saya berasumsi ini untuk permainan atau untuk jenis aplikasi yang merespons cepat maka penggunaan KEYDOWN daripada KEYPRESS.

Sunting : Sial! Saya berdiri dikoreksi (terima kasih Crescent Fresh dan David): JQuery (atau bahkan lebih tepatnya host DOM yang mendasari) tidak mengekspos detail WM_KEYDOWN dan acara lainnya. Alih-alih mereka mencerna data ini dan, dalam kasus keyDown bahkan di JQuery, kita mendapatkan:

• event.keyCode untuk kunci non-karakter
• event.charCode untuk kunci karakter

Perhatikan bahwa properti ini adalah nilai UniCode.
Catatan, saya tidak dapat menemukan referensi otoritatif untuk itu dalam dokumen JQuery, tetapi banyak contoh terkemuka di internet merujuk ke dua properti ini.

Kode berikut, diadaptasi dari beberapa java (bukan javascript) milik saya, karena itu sama sekali salah ...

Berikut ini akan memberi Anda bagian-bagian kode kunci yang "menarik":

  value = e.KeyCode;
  repeatCount = value & 0xFF;
  scanCode = (value >> 16) & 0xFF;  // note we take the "extended bit" deal w/ it later.
  wasDown = ((value & 0x4000) != 0);  // indicate key was readily down (auto-repeat)
  if (scanCode > 127)
      // deal with extended
  else
      // "regular" character

Saya tahu ini adalah pertanyaan lama, tetapi saya menemukan hari ini mencari solusi yang sudah dikemas untuk masalah ini, dan tidak menemukan apa pun yang benar-benar memenuhi kebutuhan saya.

Berikut ini adalah solusi (hanya bahasa Inggris) yang mendukung Huruf Besar (bergeser), Huruf Kecil, tanda baca, papan tombol angka, dll.

Hal ini juga memungkinkan untuk identifikasi sederhana dan mudah ke depan - dan reaksi terhadap - kunci yang tidak dapat dicetak, seperti ESC, Arrows, Tombol fungsi, dll.

https://jsfiddle.net/5hhu896g/1/

keyboardCharMap and keyboardNameMap are the key to making this work

Terima kasih kepada DaveAlger karena telah menyelamatkan saya mengetik - dan banyak penemuan! - dengan memberikan Named Key Array.

Saya baru-baru menulis sebuah modul yang disebut keysight yang menerjemahkan keypress, keydowndan keyupperistiwa menjadi karakter dan kunci masing-masing.

Contoh:

 element.addEventListener("keydown", function(event) {
    var character = keysight(event).char
 })

Bagi Anda yang datang ke sini mencari nilai karakter Unicode aktual untuk kode kunci, seperti yang saya lakukan, berikut adalah fungsi untuk itu. Misalnya, mengingat panah kanan unicode keycode ini akan menampilkan string yang terlihat\u001B\u005B\u0043

function toUnicode(theString) {
    var unicodeString = '';
    for (var i = 0; i < theString.length; i++) {
        var theUnicode = theString.charCodeAt(i).toString(16).toUpperCase();
        while (theUnicode.length < 4) {
            theUnicode = '0' + theUnicode;
        }
        theUnicode = '\\u' + theUnicode;
        unicodeString += theUnicode;
    }
    return unicodeString;
}

Anda juga dapat menggunakan properti read-only key. Itu juga menghormati kunci khusus seperti shiftdll dan didukung oleh IE9.

Ketika karakter yang tidak dapat dicetak atau karakter khusus ditekan, nilainya akan berada pada nilai kunci yang ditentukan seperti 'Shift'atau 'Multiply'.

• Papan ketik     event.key
• X             -> 'x'
• Shift+ X ->'X'
• F5            -> 'F5'

Lihat tautan ini Dapatkan Kode Kunci dari tombol tekan dan nilai karakter untuk kode kunci apa pun

$('input#inp').keyup(function(e){
   $(this).val(String.fromCharCode(e.keyCode)); 
   $('div#output').html('Keycode : ' + e.keyCode);  
});