Şimdi sahip olduğum şey bu:

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

Eğer e.keyCodebir ASCII karakter olmayabilir ( Alt, backspace, del, arrows., Vs) ... Şimdi gerekir trimbu değerlerin valueher nasılsa (tercihen programlı - değil referans tabloları içeren).

JQuery kullanıyorum.

keydownEtkinliği kullanmalıyım . keyPressBen (yakalama gereken bazı tuşlar için devreye girmez Esc, del, backspacevb.)

setTimeoutGiriş değerini almak için kullanamıyorum . setTimeout(function(){},0)çok yavaş.

Belki soruyu doğru anlamadım, ama keyupher iki girişi de yakalamak istiyorsanız kullanamazsınız ?

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

Benim tecrübelerime String.fromCharCode(e.keyCode)göre güvenilmez. String.fromCharCodeunicode charcodes'i argüman olarak bekliyor; e.keyCodejavascript anahtar kodlarını döndürür. Javascript anahtar kodları ve unicode charcodes aynı şey değildir ! Özellikle, keycodesayısal tuş takımları sıradan sayı tuşlarından farklıdır (farklı tuşlar oldukları için), keycodeher ikisi upperve lowercaseharfler için de aynı şekilde döndürülür (her iki durumda da aynı tuşa bastınız), ancak farklı olmasına rağmen charcodes.

Örneğin, normal sayı tuşu 1 keycode49 ile bir olay oluştururken sayı tuş takımı 1 (açık ile Numlock) keycode97 üretir. Birlikte kullanıldığında String.fromCharCodeaşağıdakileri elde ederiz:

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

String.fromCharCodeJavascript anahtar kodlarından değil, unicode karakter kodlarından bekler. Anahtar, aüreteceği keycodekarakterin durumundan bağımsız olarak 65 olan bir olay oluşturur ( Shiftolayda tuşa basıldığında, vb. İçin bir değiştirici de vardır ). Karakter abir Unicode sahip charcodebir karakter ise 61 Abir yer alır charcode(örneğin, uygun 41 http://www.utf8-chartable.de/ ). Ancak, bu hexdeğerler ondalık sayıya dönüştürülerek bize charcode"A" için 65 ve "a" için 97 değerini verir . Bu, String.fromCharCodebu değerler için ne elde ettiğimizle tutarlıdır .

Kendi gereksinimim sayıları ve sıradan harfleri (dizgideki konuma bağlı olarak kabul etme veya reddetme) ve kontrol karakterlerini ( F-keys, Ctrl-something) geçirmeyle sınırlıydı . Bu yüzden kontrol karakterlerini kontrol edebilirim, eğer bir kontrol karakteri değilse bir aralığa karşı kontrol ederim ve ancak o zaman gerçek karakteri almam gerekir. Durum hakkında endişelenmediğim için (yine de tüm harfleri büyük harfe değiştiriyorum) ve anahtar kod aralığını zaten sınırlandırdım, sadece sayısal tuş takımları için endişelenmem gerekiyor. Bunun için aşağıdakiler yeterlidir:

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

Daha genel olarak, karakteri güvenilir bir şekilde döndürmek için bir işlev charcodeharika olabilir (belki bir jQuery eklentisi olarak), ama şimdi yazmak için zamanım yok. Afedersiniz.

Şunu da belirtmek istiyorum e.which(jQuery kullanıyorsanız) normalleştirir hangi e.keyCodeve e.charCodesıralama anahtarın preslenmiş ne hakkında endişe gerekmez böylece. Onu birleştirmeyle ilgili sorun String.fromCharCodedevam ediyor.

[1] Bir süre kafam karıştı -. tüm dokümanlar , String.fromCharCodebir unicode beklediğini charcodesöylerken, pratikte ASCII charcodes için çalışıyor gibi göründü, ancak bu, ASCII charcodes ve unicode ondalık karakter kodlarının sıradan için örtüşmesi gerçeğiyle birlikte, onaltılıktan ondalığa dönüştürme ihtiyacı nedeniyle olduğunu düşünüyorum. Latin harfleri.

Anahtar koduyla dizinlenmiş okunabilir anahtar adları

Ben sadece numarayı dönüştürmek yapsın diye basitçe statik dizide karşılık gelen tüm değerleri listelenmiştir böylece görece az sayıda anahtar kodları vardır 65içine AkullanarakkeyboardMap[65]

Tüm anahtar kodları yazdırılabilir bir karakterle eşleşmez, bu nedenle bazı tanımlanabilir dize döndürülür.

Diziyi ihtiyaçlarınıza göre değiştirmeniz gerekebilir ve çevirmeyi umursadığınız tüm karakterler için boş dizeler döndürebilirsiniz. Aşağıdaki dizi, herhangi bir ortamda hangi tuşa basıldığını hızlı ve güvenilir bir şekilde belirlememe izin veriyor. Zevk almak!

// 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]
];

Not: Yukarıdaki dizideki her bir değerin konumu önemlidir. ""Bilinmeyen değerlerle kodları için tutuculardır.

Bu statik dizi arama yaklaşımını kullanarak aşağıdaki kod snippet'ini deneyin ...

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>

Dikkate değer anahtar kodları

AZ Harfleri: (65-90)

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

0-9 arası rakamlar : (48-57)

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

Sayısal Tuş Takımı 0-9: (96-105)

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

Ok Tuşları: (37-40)

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

Sekme Tuşu: (9)

keyboardMap[9];  // TAB

Anahtarı Girin: (13)

keyboardMap[13];  // ENTER

Boşluk Tuşu Anahtarı: (32)

keyboardMap[32];  // SPACE

İşletim Sistemine Özel Anahtar (91) Windows Tuşu (Windows) veya Komut Tuşu (Mac)

keyboardMap[91];  // OS_KEY

Alt Anahtarı: (18)

keyboardMap[18];  // ALT

Kontrol Anahtarı: (17)

keyboardMap[17];  // CONTROL

Shift Tuşu: (16)

keyboardMap[16];  // SHIFT

Caps Lock Anahtarı: (20)

keyboardMap[20];  // CAPS_LOCK

Sadece önemli bir not: yukarıdaki kabul edilen cevap keyCode> = 144, yani nokta, virgül, tire, vb. İçin düzgün çalışmaz. Bunlar için daha genel bir algoritma kullanmalısınız:

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

Nedenini merak ediyorsanız, yerleşik JS işlevinin davranışı nedeniyle bu görünüşte gereklidir String.fromCharCode(). Değerleri keyCode <= 96için şu işlevi kullanarak eşlenir gibi görünüyor:

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

Değerleri keyCode > 96için şu işlevi kullanarak eşlenir gibi görünüyor:

chrCode = keyCode

Bu garip davranış gibi görünüyorsa o zaman iyi .. Kabul ediyorum. Ne yazık ki, JS çekirdeğinde gördüğüm en tuhaf şeyden çok uzak olurdu.

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"/>

Bunun bir oyun ya da hızlı yanıt veren bir uygulama türü olduğunu ve bu nedenle KEYDOWN'un KEYPRESS'ten daha fazla kullanıldığını varsayıyorum.

Düzenleme : Dang! Do JQuery (veya hatta oldukça altında yatan DOM barındıran): Ben ayakta durmak düzeltmek (size Hilal Taze ve David teşekkür) değil WM_KEYDOWN ve diğer olayların detayını ortaya. Bunun yerine, bu verileri önceden sindirirler ve keyDown durumunda JQuery'de şunları elde ederiz:

• event.keyKarakter olmayan karakterler için kod
• karakter anahtarları için event.charCode

Bu özelliklerin UniCode değerleri olduğunu unutmayın.
Not, JQuery belgelerinde otorite için bir referans bulamadım, ancak net üzerindeki birçok saygın örnek bu iki özelliğe atıfta bulunuyor.

Bu nedenle, bazı java'lardan (javascript değil) uyarlanmış olan kod tamamen yanlıştır ...

Aşağıdaki anahtar kodun "ilginç" bölümlerini verecektir:

  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

Bunun eski bir soru olduğunu biliyorum, ama bugün bu soruna önceden paketlenmiş bir çözüm aramak için karşılaştım ve ihtiyaçlarımı gerçekten karşılayan hiçbir şey bulamadım.

İşte Büyük Harf (kaydırılmış), Küçük Harf, noktalama, sayı tuş takımı vb. Doğru şekilde destekleyen bir çözüm (yalnızca İngilizce).

Ayrıca ESC, Oklar, İşlev tuşları vb. Gibi yazdırılamayan tuşların basit ve doğrudan tanımlanmasını ve bunlara tepki verilmesini sağlar.

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

keyboardCharMap and keyboardNameMap are the key to making this work

DaveAlger'e yazarak ve çok keşif yaptığım için teşekkürler! - Adlandırılmış Anahtar Dizisini sağlayarak.

Geçenlerde bir modül olarak adlandırılan yazdı keysight çevirir keypress, keydownve keyupsırasıyla karakterler ve tuşların içine olayları.

Misal:

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

Buraya, bir anahtar kodun gerçek Unicode karakter değerlerini aramaya gelenler için, benim yaptığım gibi, işte bunun için bir işlev var. Örneğin, sağ ok unicode anahtar kodu verildiğinde, görünür dize çıktısı alınır\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;
}

Ayrıca salt okunur özelliğini de kullanabilirsiniz key. Ayrıca shift, vb. Gibi özel anahtarlara da saygı gösterir ve IE9 tarafından desteklenir.

Yazdırılamayan veya özel bir karaktere basıldığında, değer veya gibi tanımlanmış anahtar değerlerin üzerinde olacaktır .'Shift''Multiply'

• Tuş takımı     event.key
• X             -> 'x'
• Shift+ X ->'X'
• F5            -> 'F5'

Herhangi bir tuş kodu için tuş basışından ve char değerinden Anahtar Kodu Al'a bakın

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